Specify @Input () parameter for Angular root component / module

I have three root components that are loaded by the root root AppModule.

How are you going to specify a parameter @Input()for one of these components?

Neither

<app-modal [id]="'hard-coded value'"></app-modal>
<app-modal [id]="constantExportedByAppmodule"></app-modal>

selected AppModalComponent:

@Input() id: string;

It is undefined.

+2
source share
2 answers

As far as I know, you cannot pass @Input () to the boot component.

But you can use another way to do this - pass the value as an attribute.

index.html:

<my-app myAttribute="myAttributeValue">
    <div>Loading...</div>
</my-app>

app.component.ts:

@Component({
    selector: 'my-app',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css']
})
export class AppComponent {
    constructor(private elementRef:ElementRef) {
        let myAttribute = this.elementRef.nativeElement.getAttribute('myAttribute');
    }
}
+9
source

As Grigory Gossart said, you cannot transfer @Input data as usual for loaded components.

, , @Input angular. , / HTML, , @Input, .

angular, , , - , . , - , , (3) . @Input . .

, @Injectable , , . , .

: , , , , @Injectable. , . angular 2

+2

Source: https://habr.com/ru/post/1691104/


All Articles