Question

是否可以在Angular 2模板中使用不在this上下文中的变量？

例如：

<div>{{ fooBar }}</div>

fooBar需要在此组件所使用的类中定义，例如：

export class MyComponent {
  public fooBar: boolean = true;
}

但是如果你只想使用一个不在课堂上的值呢？例如，您可能想要导入字符串常量列表并在模板中有选择地显示它们：

import { MyService } from './my.service'; 
import { StringConstants } from '../string.constants';

@Component({
  selector: 'my-component',
  template: `
    <div *ngIf="isPrimary">{{ StringConstants.PRIMARY }}</div>
    <div *ngIf="isSecondary">{{ StringConstants.SECONDARY }}</div>
  `
})

export class MyComponent {
  public isPrimary: boolean;
  public isSecondary: boolean;

  constructor (private myService: MyService) {
    this.isPrimary = myService.getPrimaryContext();
    this.isSecondary = myService.getSecondaryContext();
  }
};

Answer 1

我认为有两种方法可以实现它：

1）在组件中定义与常量

同名的变量

export class MyComponent {
  StringConstants = StringConstants;
  ...

2）使用es6字符串插值

template:`
  <div *ngIf="isPrimary">${StringConstants.PRIMARY}</div>
  <div *ngIf="isSecondary">${StringConstants.SECONDARY}</div>
`
export class MyComponent {

Angular2模板 - 使用不在此

1 个答案: