Событие Ember в одном представлении уточняет другое?

Question

У меня есть небольшая выдержка из моего приложения Ember. Моя страница содержит несколько видов, каждый из которых содержит разные данные, каждый из которых имеет свои собственные контроллеры.

Я хочу, чтобы поле поиска (в индексном виде) находилось в одном представлении, которое должно «говорить» с контроллером stationList, чтобы обновлять содержимое списка StationList. Это не работает. Я получаю сообщение об ошибке: TypeError:. This.get (...) поиск не является функцией

Каротаж выводит имя регулятора, я попросил его использовать: App.StationListController

я добавил вторая форма поиска внутри на экране StationList. Это хорошо работает. В результате этого журнала выдается дамп объекта StationListController. Поэтому я предполагаю, что другая форма поиска, несмотря на мой код (в SearchFormView): controllerBinding: «App.StationListController», неправильно устанавливает контроллер.

Поэтому, я думаю, мой вопрос: почему нет?

Как я могу перенаправить изменение в поле формы в одном представлении, чтобы вызвать funciton на контроллере другого представления?

Вот мой код:

<script type="text/x-handlebars" data-template-name="application"> 
    {{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="index"> 
    <div id="searchForm">search form view search: 
     {{#view App.SearchFormView}} 
      {{view App.StationSearchField}} 
     {{/view}} 
    </div> 

    <div id="stationList">{{render stationList}}</div> 
</script> 

<script type="text/x-handlebars" data-template-name="stationList"> 
    station list view search: {{view App.StationSearchField}} 
    <ul> 
     <li>List</li> 
     <li>will</li> 
     <li>go</li> 
     <li>here</li> 
    </ul> 
    {{searchTerm}} 
</script> 

И

App = Ember.Application.create({}) 

App.SearchFormView = Ember.View.extend({ 
    init : function() 
    { 
     console.log("SearchFormView init", this.get('controller')) 
    } 
}) 

App.StationSearchField = Ember.TextField.extend({ 
    keyUp: function(event) { 
     var searchTerm = this.value 

     console.log("value",searchTerm,this.get('controller')) 

     this.get('controller').search(searchTerm) 
    } 
}) 

App.StationListController = Ember.ArrayController.extend({ 
    content  : [], 
    searchTerm : null, 

    search : function(term) 
    { 
     this.set("searchTerm",term) 
     console.log("searching",term) 
    } 
}); 

Fiddle: http://jsfiddle.net/ianbale/8QbrK/14/

Answer 1

Я думаю, что controllerBinding материал от старой версии, я не думаю, что работы больше.

Вы можете использовать controllerFor на get('controller') в StationSearchField.

this.get('controller').controllerFor('station_list').search(searchTerm) 

Но controllerFor устарел и может быть удален. В зависимости от структуры приложения вы используете needs на контроллере.

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

App.IndexRoute = Ember.Route.extend({ 
    events: { 
     search: function(term) { 
     controller = this.controllerFor('station_list') 
     controller.search(term); 
     } 
    } 
}); 

и отправьте событие поиска из вида.

Преимущество этого метода заключается в том, что вы отправляете одно и то же событие из нескольких мест, и оно будет обрабатываться таким же образом.

Обновлено jsfiddle.