Angular基础之ngFor遍历对象数组获取key和value渲染页面的几种方法

Angular的ngFor遍历对象数组的几种方法

方法一

ts文件：

export class MyDemo {

  objectKeys = Object.keys;

  myObj = {

     a: 'a',

     b: 'b'

  };

  constructor(){}

}

html文件：

<div *ngFor="let key of objectKeys(myObj)">

    {{key}} : {{myObj[key]}}

</div>

方法二

ts文件：

export class MyDemo {

  myArr = []

  myObj = {

     a: 'a',

     b: 'b'

  };

  constructor(){}

  ngOnInit() {

    this.addUniversalProperty();

  }

addUniversalProperty() {

    Object.values(this.myObj).forEach((_: any) => {

      this.myArr.push(_);

    });

  }

}

html文件：

<div *ngFor="let item of myformdata_arr">

 {{item}}

</div>

巴特西

Angular基础之ngFor遍历对象数组获取key和value渲染页面的几种方法

Angular的ngFor遍历对象数组的几种方法

方法一

ts文件：

html文件：

方法二

ts文件：

html文件：

最新文章

热门文章