模型中的值未更新到视图

我已经使用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' 
}]

从模型我怎么能追加className，width，height和innerText到人机界面。

这是我的displayView

<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: { 

} 
});

如何通过控制器向视图填充模型数据（即的innerText，尺寸的className）。注：林不使用任何this.resource（ 'somename'）

在IndexRoute我已经设置了控制器

setupController: function (controller, model) { 
    controller.set('model', model); 
    this.controllerFor('Display').set('model', model.displayInput);

在IndexRoute

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

我们用模型来设置和获取输入的值

来源

2015-06-20 vbharath

这看起来像'setupController'的默认行为，你有更多的方法逻辑？ – locks

Working demo on JS Bin.您现在正在使用视图 - 不推荐使用的功能 - 而不是组件，这会使代码看起来不是很好，也不是t理想的工具来实现你想要的行为。相反，我将您的方法转换为使用组件。此外，在Fixtures中，您定义了innnerText而不是inputText。

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

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>

然后，正确的灯具：

App.Display.FIXTURES = [{ 
id: '1', 
inputText : 'helo', 
width: '197px', 
height: '25px', 
className: 'DisplayClass' 
}];

还有你model一个问题。我认为只需在setupController模型中初始化显示控制器的模型会更容易。

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

然后，如果你想使用它，那样做（我使用的是_display模板的例子，但我没有一个线索你如何用这个）：

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

我不得不假设_display模板是用于显示控制器，因为你的问题根本不清楚。

来源

2015-06-20 19:23:58

引用该视图作为“App.DisplayView”而不是“display”已被弃用，甚至更早。我同意使用组件的建议。 – locks

谢谢。但是这里this.get（'model.width'）是未定义的。 @Daniel – vbharath

即使没有添加className和value。如何解决此问题@丹尼尔 – vbharath

模型中的值未更新到视图

回答

相关问题