1

我在这里有我的 Ember 应用程序的一小部分摘录。我的页面包含许多视图，每个视图都包含不同的数据，每个视图都有自己的控制器。

我想要一个搜索字段（在索引视图中）进入一个视图，该视图应该与 stationList 控制器“对话”以更新 stationList 视图的内容。这行不通。我收到一个错误：TypeError: this.get(...).search is not a function

日志记录输出我要求它使用的控制器的名称：App.StationListController

我在 StationList 视图中添加了第二个搜索表单。这个工作得很好。这次的日志记录输出了 StationListController 对象的转储。所以我猜测其他搜索表单，尽管我的代码（在 SearchFormView 中）：controllerBinding：'App.StationListController'，没有正确设置控制器。

所以我想我的问题是为什么不呢？

如何在一个视图中的表单字段上路由更改以在另一个视图的控制器上调用函数？

这是我的代码：

<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)
    }
});

小提琴：http: //jsfiddle.net/ianbale/8QbrK/14/

4

1 回答 1

0

我认为这些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);
      }
    }
});

并像这样从视图中分派一个搜索事件。

    this.get('controller').send('search', searchTerm);

这种方法的优点是您从多个地方分派相同的事件，并且它会以相同的方式处理。

这是更新的jsfiddle。

于 2013-06-26T09:38:38.513 回答