Question

我在AureliaJS组件中的结构是：

select income, COUNT(*) AS num_of_users
from
(
    SELECT CASE WHEN income < 10 THEN '<10'
                WHEN income <= 150 THEN '10-150'
                ELSE '> 150'
           END AS income
    FROM tab
) dt
group by income

我在<parent> <child1> <child2> </parent>中有一个对象，该对象是通过ajax请求获得的：

child1

我需要此属性具有双向绑定并且在第二个组件中可以观察到

export class Child1 {   
  fechedObject = {}: 
}

获得它的最佳方法是什么？

Answer 1

我相信最好的方法是在两个子模型上都使用双向绑定，以通过父代中的双向绑定来绑定模型。

在您的parent.html中，您需要这样做：

<child1 fetched-object.two-way="fetchedObject"></child1>

<child2 fetched-object.two-way="fetchedObject"></child2>

在两个子视图模型中，您都将变量声明为bindable：

bindable()
public fechedObject;

这样，在两个孩子中发生的所有编辑都将传递给另一个孩子。如果要防止child2中的编辑影响child1中的对象，则可以简单地在fechedObject.one-way上使用fechedObject.bind或child2进行单向绑定。

Answer 2

您可以保留<child1/>个视图模型引用并将其绑定到<child2/>：

<child1 view-model.ref='child1'></child1>

<child2 data.bind='child1.fetchedObject'></child2>

所以child.data只需要是可绑定的：

export class Child2 {

  @bindable
  data
}

将对象传递到下一个同级组件

2 个答案: