从Ember视图中删除类名 [英] Removing Classnames from Ember view

问题描述

我试图创建一个视图，该视图具有在扩展视图中描述的功能，但是具有不同的类名.发生的是ExpTypesView类是['nav'，'nav-pills'] 和 ['nav'，'nav-tabs'].如何设置它，以便它们替换在NavView中设置的类名?

I am trying to create view that has functionality described in a view in am extending, but with different class names. What is happening is the ExpTypesView classes are ['nav','nav-pills'] and ['nav','nav-tabs']. How do i set it so they replace the classnames set in NavView?

Resume.NavView = Em.View.extend({
  tagName: 'ul',
  classNames: ['nav','nav-tabs'],
  currentPathDidChange: function(){
    Ember.run.next( this, function() {
      $("ul li:has(>a.active)").addClass('active');
      $("ul li:not(:has(>a.active))").removeClass('active');
   }); 
  }.observes('controller.currentPath')
});
Resume.ExpTypesView = Resume.NavView.extend({
  classNames:['nav','nav-pills']
});

推荐答案

在Ember.View中，classNames是

In an Ember.View, classNames is a concatenated property so properties that you add will be concatenated with the super class values.

您可以使用classNameBindings在超类和后代中设置类型.

You can use classNameBindings to set the type in both the super class and the descendant.

App.NavView = Em.View.extend({
  tagName: 'ul',
  classNames: ['nav'],
  classNameBindings: ['type'],
  type: 'nav-tabs',
  currentPathDidChange: function(){
    Ember.run.next( this, function() {
      $("ul li:has(>a.active)").addClass('active');
      $("ul li:not(:has(>a.active))").removeClass('active');
   }); 
  }.observes('controller.currentPath')
});

App.ExpTypesView = App.NavView.extend({
  type: 'nav-pills',
});

这使类成为class="ember-view nav nav-tabs"和class="ember-view nav nav-pills".

JSBin示例

这篇关于从Ember视图中删除类名的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！