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

前端之家收集整理的这篇文章主要介绍了是否可以将@Input值传递给Angular 2中的app.component?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用ASP.Net来渲染我的Angular 2应用程序,而我唯一的RAZOR页面是_Layout.cshtml,我希望能够将一些初始数据从RAZOR传递到我的自举组件中,但它不会似乎工作.

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

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

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

  1. import { Component,Input } from "@angular/core";
  2.  
  3. @Component({
  4. selector: 'my-app',template: "<div id='mainBody'>Test:{{test}}</div>",directives: [MenuBarComponent,ROUTER_DIRECTIVES]
  5. })
  6. export class AppComponent {
  7. @Input() test;
  8. }

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

对主要组件(自举组件)使用输入是不可能的.您需要直接从DOM获取属性
  1. @Component({
  2. selector: 'my-app',ROUTER_DIRECTIVES]
  3. })
  4. export class AppComponent {
  5. constructor(private elementRef:ElementRef) {
  6. this.test = this.elementRef.nativeElement.getAttribute('test');
  7. }
  8. }

猜你在找的Angularjs相关文章