Angular 2 : Create Div on the Fly by Iterating Over Objects -

this question has answer here:

• observable angular 4 , ngfor supports binding iterables such arrays 2 answers

i create div's on fly iteration on objects in json variable. i know how create if had iterate on array of arrays not on objects

my json following

{       "physics" : {           "subjectcode": 101,           "subjectname": "physics",           "sectiona": 200,           "sectionb": 500,           "sectionc": 158,       },       "chemistry" : {           "subjectcode": 102,           "subjectname": "chemistry",           "sectiona": 200,           "sectionb": 500,           "sectionc": 158,       },       "maths" : {           "subjectcode": 102,           "subjectname": "maths",         "sectiona": 200,           "sectionb": 500,           "sectionc": 158       } } 

in component storing data in data variable

export class aboutcomponent implements oninit {       data: object;       public dataarray: any;       constructor(private _data: data) { }       ngoninit() {           this._data.getdata()               .subscribe(data => {                   console.log(data);                   (let key in data) {                       console.log(data[key]);                       this.dataarray = [];                       this.dataarray.push(data[key]);                   }               });       } } 

how create 3 div - physics, chemistry , maths according json on fly.
getting properties of objects not objects itself. output

{   "subjectcode": 102,   "subjectname": "maths",   "sectiona": 200,   "sectionb": 500,   "sectionc": 158   }   

instead of physics, chemistry, maths

typescript provides for..of statements https://www.typescriptlang.org/docs/handbook/iterators-and-generators.html

i know might flag duplicate of
angular 2: create divs dynamically

but kindly me. newbie , have wasted lot of time in this.

cannot find answer easy explanation.

thanks in advance.

so this:

@component({   template: `     <div *ngfor="let item of dataarray">{{ item.subjectname }}</div>   ` }) export class aboutcomponent implements oninit {   // class implementation... }