计算属性回调的返回值没有更新模板答案

【问题标题】：return value from computed properties callback did not update templates计算属性回调的返回值没有更新模板
【发布时间】：2013-12-11 17:50:57
【问题描述】：

抱歉，标题太长了。很难用言语表达。 Ember 版本：1.2.0

这里是：

我的组件：

App.AutocompleteComponent = Ember.Component.extend({
searchResults: function() {
                   var returnValue
                   var service = new google.maps.places.AutocompleteService();
                   service.getPlacePredictions({options},callback);

                   function callback(results){
                      returnValue = results;
                   }


                    return returnValue;
                   }.property('searchText')

我的模板：

{{input type="text" value=searchText placeholder="Search..."}}
<ul >
   {{#each itemResults}}
     <li>{{this.name}}</li>
   {{/each}}
</ul>

当我使用 ember chrome 调试工具进行调试时，我可以看到正确保存 searchResults 值的组件。但它没有在模板中相应更新。

有什么想法吗？

如果不建议这种处理/使用计算属性的方式，是否可以建议任何其他方式？

提前谢谢你。

【问题讨论】：

标签： ember.js

【解决方案1】：

您可能想要去抖动它（我不知道选项是什么，它是一个全局变量吗？）。并且模板是 itemResults 而不是 searchResults。 http://emberjs.com/api/classes/Ember.run.html#method_debounce

  watchSearchResults: function() {
     var self = this;
     var service = new google.maps.places.AutocompleteService();

     var callback= function(results){
         self.set('searchResults', results);
     }
     service.getPlacePredictions({options},callback);
  }.observes('searchText')

【讨论】：

【解决方案2】：

感谢 kingpin2k 的回复，

我找到了其他处理返回的方法，这些方法显然不适用于回调，并且由于计算属性在某种程度上需要“返回”，因此在这个用例中不可行。

相反，我选择使用观察者。

顺便说一句，这段代码是用来处理自动完成的。

这是最终代码：

WebClient.AutocompleteFromComponent = Ember.Component.extend({
 searchTextChanged: Em.observer('searchText',function(){ 

var service = new google.maps.places.AutocompleteService();

            service.getPlacePredictions({
                input: this.get('searchText'),
                types: ['(regions)'],
                componentRestrictions: {
                    country: 'my'
                }
            }, function(predictions, status) {
                //Start callback function
                if (status != google.maps.places.PlacesServiceStatus.OK) {
                    alert(status);
                    return;
                }
                for (var i = 0, prediction; prediction = predictions[i]; i++) {
                    console.log(prediction.description);
                    mapItem = {};
                    mapItem.name = prediction.description;
                    mapItem.type = 'map'
                    mapItem.reference = prediction.reference;
                    itemResults.push(mapItem);


                }
                //console.log(itemResults)
                self.set('itemResults', itemResults)

            });
})

模板代码还是一样的。

【讨论】：