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

发布时间：2020-12-17 07:57:29 所属栏目：安全来源：网络整理

导读：我正在使用ASP.Net来渲染我的Angular 2应用程序,而我唯一的RAZOR页面是_Layout.cshtml,我希望能够将一些初始数据从RAZOR传递到我的自举组件中,但它不会似乎工作. 在我的_Layout.cshtml中,我有以下内容： my-app test="abc"/my-app 在我的app.component.ts中,

我正在使用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;
}

我的测试变量是空白的.有没有不同的方法来做到这一点,还是只是不可能？

对主要组件(自举组件)使用输入是不可能的.您需要直接从DOM获取属性：

@Component({
  selector: 'my-app',ROUTER_DIRECTIVES]
})
export class AppComponent {
  constructor(private elementRef:ElementRef) {
    this.test = this.elementRef.nativeElement.getAttribute('test');
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!