El segundo desplegable no llama a EveryTime basado en el primer desplegable

Tengo dos lista desplegable utilizando brasas.

Tengo problemas con el cambio si el primer valor desplegable cambia y no llama cada vez que se despliega un segundo valor descendente.

Aquí he añadido mi código completo.

por favor dime que hice mal este codigo

 

Welcome to Ember.js

{{outlet}}
{{view "select" content=model prompt="Please select a name" selectionBinding="controllers.comboBox.model" optionValuePath="content.title" optionLabelPath="content.body" }}
{{input type="hidden" value=controllers.comboBox.model.title id="comboval"}}
{{view "select" content=model1 prompt="Please select a name" optionValuePath="content.title" optionLabelPath="content.title" }}

Selected: {{controllers.comboBox.model.title}}

app.js

 App = Ember.Application.create({ }); App.Router.map(function () { }); App.IndexRoute = Ember.Route.extend({ model: function () { return posts; } }); App.IndexController = Em.ArrayController.extend({ needs: ["comboBox"], sendValueToServer: function () { document.getElementById("comboval").value = this.get("controllers.comboBox.model.title"); }.observes("controllers.comboBox.model"), model1: function () { var valueq = this.get('controllers.comboBox.model.title'); console.log("value "+valueq); return posts1; }.property("controllers.comboBox.model") }); App.ComboBoxController = Em.Controller.extend({ model: null, }); App.ComboBox1Controller = Em.Controller.extend({ model1: null, }); posts = [{ title: "Raja", body: "There are lots of à la carte software environments in this world." }, { title: "Broken Promises", body: "James Coglan wrote a lengthy article about Promises in node.js." }, { title: "Broken", body: "James Coglan wrote a lengthy article about Promises in node.js." } ]; posts1 = [{ title: "Raja", body: "There are lots of à la carte software environments in this world." }, { title: "Broken Promises", body: "James Coglan wrote a lengthy article about Promises in node.js." }, { title: "Broken", body: "James Coglan wrote a lengthy article about Promises in node.js." } ]; 

Sobre la base del código publicado se supone que,

1. Es necesario guardar los valores de cada lista desplegable en una propiedad separada de un controlador.

2. Cuando el valor de la primera lista desplegable cambia, entonces el contenido de la segunda lista desplegable puede cambiar.

http://emberjs.jsbin.com/cuyemileci/1/edit?html,js,output

Se agregó una función que observa el valor del primer menú desplegable para establecer el valor del segundo controlador asociado con el valor de la segunda lista desplegable.

Es importante establecer los valores que están presentes dentro de la propiedad de contenido utilizada para la lista desplegable.

js

 App.IndexController = Em.ArrayController.extend({ needs: ["comboBox","comboBox1"], sendValueToServer: function () { document.getElementById("comboval").value = this.get("controllers.comboBox.model.title"); }.observes("controllers.comboBox.model"), model1: function () { var valueq = this.get('controllers.comboBox.model.title'); console.log("value "+valueq); return posts1; }.property("controllers.comboBox.model"), setComboBox1Model1:function(){ var valueq = this.get('controllers.comboBox.model.title'); var valueFromPosts1 = posts1.findBy("title",valueq); this.set("controllers.comboBox1.model1",valueFromPosts1?valueFromPosts1:null); }.observes("controllers.comboBox.model") }); 

hbs

 
{{view "select" content=model1 prompt="Please select a name" optionValuePath="content.title" optionLabelPath="content.title" selectionBinding="controllers.comboBox1.model1" }}