Enlace de estado habilitado de botón en Ember.js

Question

Solo me estoy mojando los pies con Ember.js, y he golpeado algo que estoy seguro de no entender.

Tengo un controlador de objeto seleccionado. Tiene contenido, que es un Ember.Object, que es el modelo seleccionado actualmente. El modelo tiene una propiedad (es Sucio), y básicamente me gustaría que mi botón de guardar en mi formulario esté habilitado solo cuando el objeto está sucio y necesita ser guardado.

He logrado enlazar el formulario muy bien, pero la propiedad isEnabledBinding en el botón Guardar no está haciendo nada o no estoy enganchando el enlace correctamente.

He preparado un jsfiddle que demuestra mi configuración básica.

http://jsfiddle.net/blargity/fqc73/1/

¿Cómo consigo el botón que se activa sólo cuando isDirty es cierto? Los enlaces también deberían funcionar si la propiedad de contenido en el controlador de objeto seleccionado cambia.

Answer 1

El problema es que no hay isEnabled propiedad en Ember.Button. Debe enlazar a la propiedad disabled.

Una posibilidad es crear un Ember.Button personalizado que maneje esto para usted, vea http://jsfiddle.net/LabpW/.

Manillar:

{{#view App.SaveModelButton modelBinding="model"}}Save{{/view}} 

JavaScript:

App.SaveModelButton = Ember.Button.extend({ 
    disabledBinding: Ember.Binding.not('model.isDirty') 
}); 

La utilizado Ember.Binding.not es sólo un atajo para la escritura de su propiedad computarizada, que se vería así:

App.SaveModelButton = Ember.Button.extend({ 
    disabled: function() { 
     return !Ember.getPath(this, 'model.isDirty'); 
    }.property('model.isDirty').cacheable() 
}); 

---

También refactorizado su código un poco:

• usted mezcló create y extend: create utilizar para las instancias y extend para las clases. Hay un buen blog post sobre this

• Es una especie de una convención de usar minúsculas para las instancias y minúsculas para las clases, por lo que debe ser App.controller en lugar de App.Controller

Answer 2

he encontrado una manera de hacer esto sin usar el Ember.Button ahora desaprobado.

En la plantilla de manillar:

<button {{action "save" target="controller"}} {{bindAttr disabled="view.isNotDirty"}}>Save</button> 

En la vista:

isNotDirty: function(){ 
    return !this.get('controller.content.isDirty') 
}.property('controller.content.isDirty').cacheable() 

(Con la versión de Ember que tengo, Ember.Binding.not no existe.Tal vez tengo que actualizar, pero los documentos no lo demuestre, ya sea por lo que quizás se quitan realmente.)