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');
  }
}

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

1 个答案: