angular - 如何在 angular 2 中绑定(bind) HTML 中组件的静态变量？

我想在 HTML 页面中使用组件的静态变量。
如何将组件的静态变量与 angular 2 中的 HTML 元素绑定(bind)？

import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Rx';
@Component({
  moduleId: module.id,
  selector: 'url',
  templateUrl: 'url.component.html',
  styleUrls: ['url.component.css']
})
export class UrlComponent {

  static urlArray;
  constructor() {
  UrlComponent.urlArray=" Inside Contructor"
  }
}

<div>
  url works!
   {{urlArray}}
</div >

最佳答案

组件模板中绑定(bind)表达式的范围是组件类实例。

您不能直接引用全局变量或静态变量。

作为一种解决方法，您可以在组件类中添加一个 getter

export class UrlComponent {

  static urlArray;
  constructor() {
    UrlComponent.urlArray = "Inside Contructor";
  }

  get staticUrlArray() {
    return UrlComponent.urlArray;
  }

}

并使用它:

<div>
  url works! {{staticUrlArray}}
</div>

关于angular - 如何在 angular 2 中绑定(bind) HTML 中组件的静态变量？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39193538/