Ember.js 2.3 在 HasMany 关系上实现 @each.property 观察者? [英] Ember.js 2.3 implement @each.property observer on a HasMany relationship?

问题描述

假设我有一个 hasMany 关系 Procedure => hasMany Steps，带有 async:true，并且我有一个名为 procedure-main 的过程组件(在过程路由上)，它列出了如下步骤:

Say I have a hasMany relationship Procedure => hasMany Steps, with async:true, and I have a Procedure Component (on the procedure route) called procedure-main, which lists the steps as so:

{{#each steps as |step| }}
 {{step.title}}
{{/each}}

我需要观察每个步骤的属性(例如，stepStatus)在任何步骤上更改为 stepStatus 时.在 Ember 1.7 中，我在过程控制器上有这样的东西:

I need to observe a property on each step (say, stepStatus) on change to the stepStatus on any of the steps. In Ember 1.7, I had something like this on the procedure controller:

stepsStatusObserver: function(){
...
}.observes('[e-mail]')

这是在任何步骤上的 stepStatus 更改时触发的，并且每当状态更改时，我在此函数中的任何内容都会被触发.但是，在 Ember 2.3 中，我无法实现这一点.我试过

This was fired on change of stepStatus on any on the steps, and whatever I had in this function was fired whenever the status changed as well. However, in Ember 2.3, I cannot implement this. I have tried with

stepsStatusObserver: Ember.observer('steps.[].stepStatus', function(){
...
})

但这只会在页面上列出步骤时触发一次.当我将一个步骤的状态更改为新值时，该函数永远不会被触发.

but this only fires once when the steps are being listed on the page. When I change the status of one step to a new value, the function is never fired.

如何在 Ember 2.3 中复制此功能?

How can I replicate this functionality in Ember 2.3?

注意:在我的用例中，我不能依靠单击按钮手动设置观察者内部的函数，因为如果 stepStatus 属性在任何步骤发生更改，它必须自动触发.

Note: In my use case, I cannot rely on manually setting off the function inside the observer on the click of a button as it must automatically fire if the stepStatus property was changed on any step.

推荐答案

问题在于 steps.[].stepStatus 不再是有效的依赖键.你应该用 [e-mail] 替换它.

The problem is that steps.[].stepStatus is not a valid dependent key anymore. You should replace it by [e-mail].

以下是当前 Ember 版本中有效和无效依赖键的摘要:

Here is a summary of valid and invalid dependent keys in current Ember versions:

• array - 这会观察数组引用本身是否发生变化，例如用另一个值或数组替换整个数组，例如 oldValue !== newValue.
• array.[] - 观察数组本身何时改变(上图)和数组长度改变(功能上等同于 array.length)
• [e-mail] - 观察上述两种情况 和 当某些数组项的 property 发生变化时
• array.@each.{prop,anotherProp} - 您还可以在仅指定一个键的同时观察多个属性.这将扩展为 [e-mail] 和 [e-mail].
• array.@each - 不再有效，没有尾随 @each.使用 .[] 代替.
• [e-mail] - 也无效.请注意，@each 仅在一层深度下起作用.您不能使用诸如 [e-mail] 或 [e-mail][e-mail] 之类的嵌套表单.
• array.[].property - 不再有效.改用 @each 表单.

• array - this observes if the array reference itself changes, e.g replacing the entire array with another value or array such as that oldValue !== newValue.
• array.[] - this observes both when the array itself changes (above) and when the array length changes (functionally equivalent of array.length)
• [e-mail] - observes both cases above and when property of some of the array's items change
• array.@each.{prop,anotherProp} - you can also observe multiple properties while specifying only one key. This expands to [e-mail] and [e-mail].
• array.@each - isn't valid anymore, no trailing @each. Use .[] instead.
• [e-mail] - Also not valid. Note that @each only works one level deep. You cannot use nested forms like [e-mail] or [e-mail][e-mail].
• array.[].property - not valid anymore. Use @each form instead.

这篇关于Ember.js 2.3 在 HasMany 关系上实现 @each.property 观察者?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！