Question

我遇到了Ember计算属性的问题：似乎一旦模板更新，它就会停止侦听依赖项属性中的更改。但我不明白为什么会这样。

这是我的模板：

{{input type="text" value=searchText placeholder="Search for users..."}}
    <br>
    <ul>
      {{#each user in searchResults}}
        <li>{{user.Handle}}</li>
        {{else}}
        <p>No users found.</p>
      {{/each}}
    </ul>

以下是我的控制员：

    App.AutocompleteController = Ember.Controller.extend({
    searchText: null,
    searchResults: function () {
        var searchText = this.get('searchText');
        var data = { 'searchTerm' : searchText };
        var self = this;
        alert("Calling searchResults");
        if (!searchText) { return; }
        if (searchText.length < 2) { return; }
        $.get('/searchUsers', data).then(function (response) {
                self.set("searchResults", JSON.parse(response));
            }); //end then
    }.property('searchText')
});

searchResults第一次实际进行AJAX调用并返回数据时，会自动填充自动填充结果，但之后，在刷新客户端之前，searchResults不再被调用。

Answer 1

永远不会。它就在代码中。在一个成功的ajax代码上，我将searchResults重新分配给一个静态数组，不再是一个函数。

然而，返回将无法使用.then，因此我仍需要一种返回数据的解决方法。为此，我将添加一个更传统的Ember事件监听器来调用我的'search'函数，该函数将重置'searchResults'的属性

新模板：

    {{input type="text" value=searchText placeholder="Search for users..." action=search on='change'}}

<ul>
  {{#each user in searchResults}}
    <li>{{user.Handle}}</li>
    {{else}}
    <p>No users found.</p>
  {{/each}}
</ul>

新控制器：

App.AutocompleteController = Ember.Controller.extend({
searchText: null,
search: function () {
    var searchText = this.get('searchText');
    var data = { 'searchTerm' : searchText };
    var self = this;
    if (!searchText) { return; }
    if (searchText.length < 2) { return; }
    else {
    $.get('/searchUsers', data).then(function (response) {
            self.set("searchResults", JSON.parse(response));
        }); //end then
    }
}.property('searchText')

}）;

Ember Computed Property Listener在首次成功返回后停止运行

1 个答案: