Question

我正在尝试根据从后端获取的值列表来检查/取消选中复选框。我在绘完页面后立即尝试这样做。

我的用于获取数据的应用程序代码封装在ngOnInit中，我正在尝试在ngAfterContentChecked中进行修改。但是，它失败了，当我从我的组件中执行document.getElementById()时，它返回null。

P.S：我不能使用model，因为我正在处理键值对。因此，我手动获取值。更多相关信息 - Angular 2 - Displaying checkboxes using key-value pairs

编辑1：

组件：

@Component({
    selector: 'xxx',
    templateUrl: './myHtml.html',
})

export class MyComponent implements OnInit, AfterContentChecked {

myList: Param[];

ngOnInit() {
  this.myList = //logic for fetching data
  console.log(this.myList); // This is getting printed
}

ngAfterContentChecked() {
  console.log(this.myList); // This is also getting printed
  for ( var i = 0; i < this.myList; i++ ) {
    document.getElementById(this.myList[i].paramName.concat(this.myList[i].paramValue).checked = true;
  }
}
}

HTML：

<div *ngFor="let var of myList">
  <input type="checkbox" id="{{param.paramName}}{{param.paramValue}}" value="{{var.paramValue}}"><label>{{var.paramValue}}</label>
</div>

组件中的

document.getElementById返回null

编辑2：刚刚意识到this.myList没有被记录 - 我从其他地方设置了值，并认为它已经初始化了。

生命周期钩 - 角2

0 个答案: