Javascript 模型中的值不会更新到视图中

我使用Ember.View显示了一个文本框。 在模型中，我指定了输入的所有细节

App.Display = DS.Model.extend({
inputText: DS.attr('string'),
width: DS.attr('string'),
height: DS.attr('string'),
className: DS.attr('string')
})
App.Display.FIXTURES = [{
id: '1',
innnerText : 'helo',
width: '197px',
height: '25px',
className: 'DisplayClass'
}]

从模型中，我如何将类名、宽度、高度和innerText附加到显示单元中

这是我的显示视图

 <script type="text/x-handlebars" data-template-name="_display">
{{#view 'App.DisplayView'}}{{/view}}
 </script>

 App.DisplayView = Ember.View.extend({
tagName: 'input',

});

 App.DisplayController = Ember.ArrayController.extend({
actions: {

}
});

在索引路径中

App.IndexRoute = Ember.Route.extend({
model: function(){
    return {
        //findall of model name 
        displayInput : this.store.findAll('display')
 }
 }

现在要使用模型来设置和获取输入的值，您使用的是视图（现在已弃用的功能），而不是组件，这会使代码看起来不太好看，而且它不是实现所需行为的理想工具。相反，我将您的方法转换为使用组件。另外，在fixture中，您已经在nertext中定义了

input，而不是
input

那么，让我们从组件开始。代码：

App.DisplayComponentComponent = Ember.Component.extend({
   tagName: 'input',
  attributeBindings: ['style', 'value'],
  style: Ember.computed('model', 'model.{width,height}', function() {
    var ret = '',
        width = this.get('model.width'),
        height = this.get('model.height');

    if (width) {
      ret += 'width: ' + width + ';';
    }

    if (height) {
      ret += 'height: ' + height + ';';
    }

    return ret;
  })
});

组件模板：

<script type="text/x-handlebars" data-template-name="display-component">
</script>

您的
型号也有问题。我认为在
setupController
model中为显示控制器初始化模型会更容易

setupController: function (controller, model) {
    controller.set('model', model);
    this.store.findAll('display').then(function(displays) {
        this.controllerFor('display').set('model', display.get('firstObject'));
    });
}

然后，如果您想使用它，请这样做（我正在使用您的示例中的
\u display
模板，但我不知道如何使用它）：


{{display component model=model class=model.className value=model.inputText}

我必须假设
\u display
模板是针对display controller的，因为您的问题根本不清楚。
这看起来像
setupController
的默认行为，您在方法中有更多的逻辑吗？将视图称为
'App.DisplayView'
而不是
'display'
甚至更早就被弃用了。我同意用组件代替的建议。谢谢。但是这里这个.get（'model.width'）是未定义的@但是，不会附加类名和值。如何解决我在实现中使用的@Danielviews，现在是否已弃用？我参考了一些建议我使用Ember.View的教程。谢谢你提供的信息@丹尼尔
App.Display.FIXTURES = [{
id: '1',
inputText : 'helo',
width: '197px',
height: '25px',
className: 'DisplayClass'
}];

setupController: function (controller, model) {
    controller.set('model', model);
    this.store.findAll('display').then(function(displays) {
        this.controllerFor('display').set('model', display.get('firstObject'));
    });
}

<script type="text/x-handlebars" data-template-name="_display">
{{display-component model=model class=model.className value=model.inputText}}
</script>