Data binding 绑定在Angular2模板中不起作用

使用

Alert.showAlert（“success”，“someMsg”）调用时，errorType不显示

来自另一个

组件

，但它在声明errorType本身时进行初始化

组成部分：

 import {Component} from 'angular2/core';

    @Component({
        selector: 'alert-component',
        templateUrl: 'app/alert.template.html'
    })

    export class Alert {

     public static errorType:string;
     public static messageAlrt:string;

     public static showAlert(type:string, message:string): void{
          Alert.errorType=type;
        }

    }

模板：

<div id="messageAlert" >
            <strong>{{errorType}}:</strong> this is the error message at top of the page      
        </div>

{{errorType}:这是页面顶部的错误消息

---

非常感谢您在解决这个问题时提供的帮助，errrorType值没有绑定到erroType，这是因为您使用了静态字段。使用

{{errorType}

时，将使用组件的非静态属性

我将以这种方式重构您的组件：

import {Component} from 'angular2/core';

@Component({
    selector: 'alert-component',
    templateUrl: 'app/alert.template.html'
})
export class Alert {
  public errorType:string;
  public messageAlrt:string;
}

当您想要显示警报时，我会动态添加它：

@Component({
  (...)
  template: `<div #target></div>`
})
export class SomeComponent {
  @ViewChild('target', {read: ViewContainerRef}) target;

  showAlert(type:string, message:string) {        
    this.resolver.resolveComponent(Alert).then(
      (factory:ComponentFactory<any>) => {
        this.cmpRef = this.target.createComponent(factory);
        this.cmpRef.type = type;
      }
    );
  }

@组件({
(...)
模板：``
})
导出类组件{
@ViewChild（'target'，{read:ViewContainerRef}）目标；
showAlert（类型：string，消息：string）{
此.resolver.resolveComponent（警报）。然后(
（工厂：零部件工厂）
您可以在调用showAlert功能的地方共享代码吗