双向数据绑定对象？

Question

我在父组件中有以下内容：

output = {};

在孩子中我有这个：

 @Input() output: GroupCompnent;
this.output.output = this.gridOptions.api.getSelectedRows();

现在我得到了这个结构：

Object {output: Array(2)}
output Array(2)
[0]:Object
[1]:Object

但我想要这个：

[Object, Object]

有什么建议我怎么做？

我希望实现与对象的双向数据绑定，因此当我将值更改为要在父项上引用的子项并在父项中获取该数据时。

父：

  output = {};
   <div *ngIf="visible">
     <z-ag-table [items]="gridOptions" [output]="output"></z-ag-table>
    </div>

子：

 @Input() output:GroupComponent;
 selected = () =>  this.output.output = this.gridOptions.api.getSelectedRows();

Answer 1

您目前获得的输出完全正确。您正在将数组插入对象output中的属性output。似乎您希望output实际上是一个数组。因此，将output的声明更改为父级中的数组：

output = [];

然后在父级中，不要只是按原样分配值，让我们获取数据，然后将其推送到output数组。此外，您不应该使用组件（？）

标记@Input()

@Input() output:GroupComponent;

因为它是一个数组：

@Input() output: Array<Object> // or if it's a typed array, change it

然后在OnInit我们可以获取数组并将内容映射到output数组：

ngOnInit() {
  let arr = this.gridOptions.api.getSelectedRows()
  arr.map(x => this.output.push(x))
}

我们需要这样做，以便在父 output和孩子 output之间保持参考。

Answer 2

对于双向数据绑定，您需要在子节点中声明输入和输出，如下所示：

@Input() output= 0;
@Output() outputChange = EventEmitter<any>();

请记住，输出事件必须命名为“更改”

阅读评论后，我建议：

selected = () =>  { this.output.splice(0); 
     this.output.concat(<your new array>(this.gridOptions.api.getSelectedRows()))
}