Angular2：输入绑定

问题描述：

我想这里定义与组件的输入绑定：Angular2：输入绑定

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-child 但组件名称从未显示

我甚至试图做的console.log但它表明：

组件名isundefined

<div ng-switch="accessLevel"> 
<div class="customer" ng-switch-when="ENABLED">This is customer data</div> 
<div class="customer-blurr" ng-switch-when="DISABLED"> This is disabled Customer Data</div> 
<div class="customer-blurr" ng-switch-default> <demo-error [componentName]="componentname"></demo-error></div> 
</div>

和的error.html

<div> you are not allowed to access {{component}} </div>

演示错误：

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

@Component({ 
    selector: 'demo-error', 
    templateUrl: './error.component.html', 
    styleUrls: ['./error.component.css'] 
}) 
export class ErrorComponentDemo implements OnInit { 
@Input() public componentName:string; 
    constructor() { 
    console.log("componentName is" +this.componentName) 
    } 

    ngOnInit() { 
    }

}

And in **CustomerComponent:** 

@Component({ 
    selector: 'customer', 
    templateUrl: './customer.component.html', 
    styleUrls: ['./customer.component.css'] 
}) 
export class CustomerComponent extends SuperChildComponent{ 
    public allowed: boolean = false; 
    public accessLevel:AccessLevel =null; 
    public componentname:string; 

    constructor(private authenticationService : AuthorizationService) { 
    super(); 
    this.componentname=this.constructor.name; 
    this.accessLevel=this.authenticationService.isUserLoggedIn()?this.authenticationService.componentAccessLevel(this.constructor.name):null; 
    }

缺少什么我在这里？

谢谢

答

您的输入将不会在构造函数中可用。试试这个f.e.

@Input set componentName(value: string) { 
    if(value != null && value != undefined) { 
    this._componentName = value; console.log(this._componentName); 
    } 
} 

_componentName: string

这样你就可以做你的内set

答

在if声明方法的调用，您需要输“[]”如果你的输入是一个字符串。

componentName="componentname"

Angular2：输入绑定

相关推荐