角度数组动态绑定绑定到所有元素而不是1

时间:2018-06-07 09:53:13

标签: angular typescript

我有一个像下面的数组对象

let myArray=[
 { "id":"100",
  "child1":[
    {"id":"xx","Array":[]},
    {"id":"yy","Array":[]},
      {"id":"zz","Array":[]}
    ]
 },
 {  "id":"200",
  "child1":[
   {"id":"xx","Array":[]},
    {"id":"yy","Array":[]},
      {"id":"zz","Array":[]}
    ]
 }
  ]

我有角度模板,如bellow

<div *ngFor="let obj of myArray">
    Id:{{obj.id}}
 <div *ngFor="let objChild of obj.Child1">
    Id:{{objChild.id}}
    Array:{{objChild.Array}}    
    AddElementtoArray:<button (click)="add(objChild.Array)">add</button>    
   </div>
 </div>

以及处理角度分量的方法,如下所示

add(oArray)
{
oArray.push('xxx');
}

并且如果单击id 1的添加按钮,则为id 1和2的子数组添加值,我尝试了其他可能性,例如获取索引并在代码中过滤它并尝试为特定的对象子,但它附加了对象1和2,请让我如何解决这个问题

1 个答案:

答案 0 :(得分:0)

通过发送父级和子级索引来尝试此操作,这将帮助您获取特定元素

<div *ngFor="let obj of myArray; let parentIdx = index;">
   Id:{{obj.id}}
 <div *ngFor="let objChild of obj.Child1; let childIdx = index;">
   Id:{{objChild.id}}
   Array:{{objChild.Array}}    
   AddElementtoArray:<button (click)="add(parentIdx, childIdx 
   )">add</button>    
 </div>
</div>

功能

add(parentidx, childidx) {
  this.myArray[parentidx].Child1[childidx].Array.push('xxx');
}