Ember.js Ember.Component.set不'；t更新模板

我有一个显示对象值的组件。 此对象使用

Ember.$.ajax

加载到

字符串中

因为

strings

是异步加载的，并且/或者可以在运行时更改（本例中没有），所以我使用

.done（）

来获取所需的值

一个简单的模板就行了

{{u-string name="test_value"}}

但是如果用一个

{{u-string}}

组件嵌套

{{yield}}

s， 它不会更新模板

 {{#u-button}}
     {{u-string name="test_btn"}}
 {{/u-button}}

以下是我的简化组件代码：

import Ember from 'ember';

var strings = Ember.$.ajax({
        url: '/api/strings'
    });

export default Ember.Component.extend({
    tagName: 'span',
    value: '?',
    count: null,

    willInsertElement: function() {
        console.log("Strings wait for \"" + this.get('name') + "\"");
        strings.done((value) => {
            Ember.run(() => { 
                var s = value[this.get('name')] || this.get('name');
                console.log("Strings got \"" + s + "\" for \"" + this.get('name') + "\"");
                this.set('value', s);
            });
        }); 
    }
});

这是我的

{{u-string}

模板：

{{value}}

如果我转到，它将正确显示文本，但当我直接访问页面（或刷新）时，它将不会正确显示文本。 基于

console.log

和调试，正确设置

值

，但模板不更新

我是在做一些根本错误的事情，还是应该这样做？ 以后是否可以使用

此
（通过异步回调）？
如果不是，我将如何更新我的组件值？
我认为，从Ember的角度来看，您的问题不在于代码的整体功能，而在于
Ember.run（）中的
willInsertElement
部分没有提到组件

您有两种方法来处理此问题：

使用占位符变量（通常为
self
）保存
此
的值，该值可在其他“内部”函数中访问
用于更改此
引用的内容
备选案文1：

willInsertElement: function() {
    var self = this;
    console.log("Strings wait for \"" + this.get('name') + "\"");
    strings.done(function (value){
        Ember.run(function(){ 
             var s = value[self.get('name')] || self.get('name');
            console.log("Strings got \"" + s + "\" for \"" + self.get('name') + "\"");
            self.set('value', s);
        });
    }); 
}

备选案文2：

willInsertElement: function() {
    console.log("Strings wait for \"" + this.get('name') + "\"");
    strings.done(function (value){
        Ember.run(function(){ 
             var s = value[this.get('name')] || this.get('name');
            console.log("Strings got \"" + s + "\" for \"" + this.get('name') + "\"");
            this.set('value', s);
        }.bind(this));
    }.bind(this)); 
}

解决了问题,，
第三方库改变了
{{u-button}}
。
当您使用上述代码时，控制台中是否存在任何异常/错误？@Isowen没有错误/异常我使用的是ES6箭头函数，类似于“选项1”。如果您检查转码javascript（ES5）。