angular - 是否可以将 @Input 值传递给 Angular 2 中的 app.component？

Question

我正在使用 ASP.Net 来呈现我的 Angular 2 应用程序，我拥有的唯一 RAZOR 页面是 _Layout.cshtml，我希望能够将一些初始化数据从 RAZOR 传递到我的引导组件中，但是它似乎不起作用。

在我的 _Layout.cshtml 中，我有以下内容:

<my-app test="abc"></my-app>

在我的 app.component.ts 中，我有:

import { Component, Input } from "@angular/core";

@Component({
    selector: 'my-app',
    template: "<div id='mainBody'>Test:{{test}}</div>",
    directives: [MenuBarComponent, ROUTER_DIRECTIVES]
})
export class AppComponent {
    @Input() test;
}

我的测试变量是空白的。是否有不同的方法来做到这一点，还是根本不可能？

Answer 1

不能对主要组件(自举组件)使用输入。您需要直接从 DOM 中获取属性:

@Component({
  selector: 'my-app',
  template: "<div id='mainBody'>Test:{{test}}</div>",
  directives: [MenuBarComponent, ROUTER_DIRECTIVES]
})
export class AppComponent {
  constructor(private elementRef:ElementRef) {
    this.test = this.elementRef.nativeElement.getAttribute('test');
  }
}