指令exportAs不起作用

时间:2018-03-28 18:51:21

标签: angular angular2-directives

当我尝试使用exportAs属性od指令装饰器时遇到问题:

app.component.ts

import {Component} from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {}

app.component.html

<div *repeat="5; let i = index; let odd = odd;" [class.odd]="odd" #r="repeatDir">{{i}} - Hello World!</div>

repeat.directive.ts

import {Directive, Input, OnInit, TemplateRef, ViewContainerRef} from '@angular/core';

@Directive({
  selector: '[repeat]',
  exportAs: 'repeatDir'
})
export class RepeatDirective implements OnInit {
  @Input() repeat: number;

  constructor(private _templateRef: TemplateRef<any>,
              private _viewContainerRef: ViewContainerRef) {}

  ngOnInit() {
    for (let i = 0; i < this.repeat; i++) {
      this._viewContainerRef.createEmbeddedView(this._templateRef, {
        index: i,
        odd: i % 2 === 1
      });
    }
  }
}

当我运行此示例时,我收到错误: enter image description here

0 个答案:

没有答案