переплета несколько атрибутов к тому же элементу

Question

Я пытаюсь сделать что-то вроде этого:

<a href="#/{{unbound goto}}" {{bind-attr class=":menu-entry-text :nowrap active:selected-menu-entry-text"}} {{bind-attr id="active:active-nav:inactive-nav"}} {{bind-attr data-goto="goto"}}> 

Но только первый атрибут (class) получает значение: id и data-goto не определены. Можно ли установить несколько атрибутов с bind-attr в том же элементе? Как?

Answer 1

Да, вы можете связать сразу несколько атрибутов с помощью нескольких помощников bind-attr, например, в вашем примере или просто поместить все атрибуты в один вспомогательный помощник bind-attr. Однако у вас есть проблема в вашем примере, поэтому все работает не так, как ожидалось.

Форма «значение, если истина», которую вы используете для атрибута класса, не может применяться к другим типам атрибутов. Все остальные атрибуты должны быть привязаны к динамическому свойству на контроллере. Например, если у вас есть контроллер, который выглядел так:

App.MyController = Ember.ObjectController.extend({ 
    myId: function() { 
    if (this.get("active") === true) { 
     "active-nav" 
    } else { 
     "inactive-nav" 
    } 
    }.property("active") 
}); 

Тогда вы бы связать, что как так:

<a href="#/{{unbound goto}}" {{bind-attr id="myID"}}> 

Просто побочное замечание на этом примере, вероятно, это код запах, если вам имеют динамический идентификатор для HTML-элемента. Идентификаторы должны однозначно идентифицировать один элемент, и я не ожидал, что они изменятся. Кажется, что класс будет лучше подходит для этого варианта использования.