Dans un modèle Guidons ember.js, est-il possible d'avoir à la fois les attributs statiques et dynamiques de classe?

Question

En utilisant l'exemple de l'application de todo déjà galvaudé, disons que je veux un élément avec un « todo » classe (statique) et un « est-fait » classe (dynamique):

<div {{bindAttr class="todo isDone"}}>
  Other stuff in here
</div>

Dans ce cas, « isDone » et « todo » sont tous les deux devraient être des propriétés sur mon objet de vue, qui est ce que je veux pour « isDone », mais pas pour « todo ». Je travaille actuellement autour de ce en ajoutant une propriété « todo » sur mon point de vue qui est égale à une chaîne statique « todo ». Est-il possible d'avoir un attribut de classe statique lors de l'utilisation bindAttr?

Exemple Fiddle: http://jsfiddle.net/nes4H/4/

Answer 1

EDIT:

Nous avons corrigé cela dans Ember!

Sur une accumulation de maître, ou après 0.9.6 est libéré, vous pouvez maintenant faire:

<div {{bindAttr class="App.foo:a-bound-class :a-static-class"}}></div>

---

Réponse précédente:

Vous pouvez malheureusement pas avoir les deux noms de classes statiques et dynamiques lors de l'utilisation bindAttr.

Je suggère d'utiliser une ou plusieurs propriétés calculées sur votre point de vue à la sortie les deux noms de classe statiques et dynamiques.

Prenant en charge les noms de classe statique et dynamique serait très bien, mais la façon dont bindAttr fonctionne actuellement, il est impossible. bindAttr ne sait rien au sujet de l'élément auquel il est attaché à être lors de la compilation du modèle.

Answer 2

Je ne sais pas si vous pouvez le faire avec bindAttr, mais l'aide de #view ne vous permet de définir les classes statiques et les dynamiques:

{{#view App.TodoView class="todo" classBinding="isDone"}}
  inner content
{{/view}} 

Answer 3

Dans maître Ember, un changement a été commis aujourd'hui pour permettre aux classes statiques à spécifier dans les bindAttr par préfixer deux points.

https://github.com/emberjs/ember.js/commit/ce385e3294be019215c555511c7f393aebc02e41

Cela peut changer avant la prochaine version, bien sûr, mais cela est un problème que l'équipe de base Ember veut résoudre.

Answer 4

Dans Ember 1.10.0, bindAttr est dépréciée. Vous pouvez directement lié à une variable de classe div. ici la variable de couleur est liée à la classe d'un div:

<div class="{{color}}"></div>

La ligne si l'aide peut également être utilisé dans ces contextes:

<div class="{{color}} {{if isEnabled 'active' 'disabled'}}"></div>

http://emberjs.com/ blog / 2015/02/07 / Ember-1-10-0-released.html