I am trying to access fields of multiple components inside main component class using function Array.
import { NgModule, ApplicationRef, ComponentRef } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component.js';
import { SrcComponent } from './src.component.js';
const components = [AppComponent, SrcComponent];
@NgModule({
imports: [BrowserModule],
declarations: components,
entryComponents: components
})
export class AppModule {
modName: any = null;
constructor() {
this.getModuleName(components);
}
getModuleName(srcCom: any[]) {
var myVar = {};
for (let i = 0; i < srcCom.length; i++) {
myVar = srcCom[i];
// Here I am trying to access fields from different componet
this.title = myVar.title;
this.modName = myVar._moduleName;
console.log(myVar);
}
console.log(myVar);
return srcCom;
}
ngDoBootstrap(appref: ApplicationRef) {
appref.bootstrap(AppComponent);
appref.bootstrap(SrcComponent);
}
}
Component class
import { Component } from '@angular/core';
@Component({
selector: 'new-app',
template: `<h1>{{title}}</h1>`
})
export class AppComponent {
public _moduleName: string = null;
constructor() {
this._moduleName = 'App-Component';
}
title = 'App';
}
second component
import { Component } from '@angular/core';
@Component({
selector: 'new-app1',
template: `<h1>{{title}}</h1>`
})
export class SrcComponent {
public _moduleName: string = null;
constructor() {
this._moduleName = 'Src-Component';
}
title = 'Source';
}