2013-05-12 3 views
1

Я пытаюсь создать представление, которое имеет функциональность, описанную в представлении в расширении, но с разными именами классов. Что происходит, классы ExpTypesView являются ['nav', 'nav-pills'] и ['nav', 'nav-tabs']. Как установить его так, чтобы они заменили имена классов, установленные в NavView?Удаление Classnames из Ember view

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'] 
}); 

ответ

3

В Ember.View, classNames является concatenated property так свойства, добавляемые будет слита со значениями супер-класса.

Вы можете использовать classNameBindings, чтобы установить тип как для суперкласса, так и для потомка.

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 example

2

Этот маленький грязный обходной путь дает мне то, что я хочу, но если вы знаете лучший способ или любой ресурс, который объясняет это, пожалуйста, дайте мне знать!

Resume.ExpTypesView = Resume.NavView.extend({ 
    //classNames:['nav','nav-pills'], 
    init: function(){ 
    this.set('classNames', ['nav','nav-pills']); 
    } 
}); 
Смежные вопросы