更新数组中的对象时，EmberJS 视图未更新答案

【问题标题】：EmberJS view is not updating when updating an object in an array更新数组中的对象时，EmberJS 视图未更新
【发布时间】：2018-01-31 18:13:21
【问题描述】：

我有一个车把模板，其中有一张桌子。

<script type="text/x-handlebars" data-template-name="customers">
<table>

    <tbody>
    {{#each nomday in allnominationdays}}
    <tr class="nomdays" {{action "saveNomDay" nomday on="focusOut"}}>
      <td>{{nomday.confirmedVolume}}</td>
      <td>{{nomday.variance}}</td>  
    </tr>
    {{/each}}
    </tbody>

</table>
</script>

在我的控制器中，我有一个函数，我从 tr 上定义的动作 saveNomDay 调用它。

update: function()
{
    console.log('Not Working');
    allnominationdays = this.get('allnominationdays');
    //this.set('allnominationdays',null);

    allnominationdays.objectAt(0).variance = 75;
    this.set('allnominationdays',allnominationdays);
},

但是当我改变对象数组的值时，我的观点并没有改变。如果我将对象数组设置为空，则模板更新并且不显示表。我不确定是什么破坏了要更新的视图的绑定？

代码块在控制器函数中更新视图，但在动作调用时不更新。但是在将对象数组设置为 null 的操作内部会更新视图并删除整个表。不知道发生了什么事。 EmberJS 中的新功能

谢谢，

【问题讨论】：

为什么不使用 Ember.set 来更改对象的属性 (variance)？尝试使用Em.set(allnominationdays.objectAt(0), 'variance', 75)。
感谢@Microfed Ember.set(allnominationdays.objectAt(0), 'variance', 75);作品。我不知道这个集合语法。还有一种类似的 get 语法可以从数组中只获取 1 个对象，这与我所做的 allnominationdays = this.get('allnominationdays'); 不同。
还有@Micofed 了解为什么代码在控制器函数中工作但在被操作触发时不能工作？
您可以通过 array.get('firstObject')（在您的情况下为 this.get('allnominationdays.firstObject')）或 array[0]（objectAt 实际上做同样的事情）从 Ember.Array 中获取第一个对象。
我不确定你的第二个问题。在我看来，控制器的动作和控制器的功能/方法——如果你从这些函数内部的代码来看，是一回事，所以我不能说什么。 :)

标签： ember.js handlebars.js

【解决方案1】：

我为时已晚，但迟到总比没有好。发生这种情况是因为视图在值的更新可以传播到屏幕之前被渲染。执行以下代码：

--模板

    {{#if isVisible}}
    <table>

    <tbody>
    {{#each nomday in allnominationdays}}
    <tr class="nomdays" {{action "saveNomDay" nomday on="focusOut"}}>
      <td>{{nomday.confirmedVolume}}</td>
      <td>{{nomday.variance}}</td>  
    </tr>
    {{/each}}
    </tbody>

</table>
{{/if}}

--组件/控制器

self.set('isVisible',false);
var propgationPromise = new Promise(function(resolve, reject) {
            //update Value
            console.log("promise started");
            resolve();
            });
            propgationPromise.then(function(){
                console.log("promise stopped");     
                self.set('isVisible', true);
            });

【讨论】：