Question

这是我的开始页面，它在后端呈现（而不是<%- include('template/head'); %> <application [userdata]='"propval"'> Loading... </application> <%- include('template/foot'); %>会有一个包含json配置的变量）：

@Component({
    moduleId: module.id,
    selector: 'application',
    templateUrl: './app.component.html',
    providers:[
        ProgressBar
    ]
})
export class AppComponent implements OnInit {

    public userdata;

    constructor(public progressBar :ProgressBar, private router: Router) {
        console.log("constructor",this.userdata);
    }

    public async ngOnInit() {
        console.log("ngOnInit",this.userdata);
    }

}

这是我处理“应用程序”的组件。选择器：

constructor undefined
ngOnInit undefined

结果，在控制台中我得到：

userdata

如何阅读AppComponent属性？也许这不会在application中完成，因为app.component.html选择器不会在application内呈现。 <{1}}选择器在后端呈现。

Answer 1

question Vega shared指出bootstrap和entry组件不能使用输入绑定。（我没有找到源代码，但是通过推断条目组件不应该有父代，有意义的是它们不会使用输入绑定。）

接受的答案使用ElementRef来获取数据属性，该方法也适用于您的案例。

import {ElementRef} from '@angular/core';

constructor(private _ref: ElementRef) {}

ngOnInit() {
    this.userdata = this._ref.nativeElement.getAttribute('userdata');
}

Sample plunker

可能适合您或其他人的其他解决方案：配置InjectionToken（doc）或使用服务。

如何在初始化时读取应用程序选择器的属性？

1 个答案: