Question

我无法绑定变量输入/输出。我不知道自己做错了什么。

HTML

<p [timeDelta]="'2016-09-20 00:00:00'">{{delta}}</p>

这是我的指示：

import { Directive, ElementRef, Input, Output, Renderer, EventEmitter } from '@angular/core';

@Directive({ selector: '[timeDelta]' })
export class TimeDeltaDirective {
    @Input('timeDelta') myDate: string;
    @Output() delta: string;

    constructor(renderer: Renderer, el: ElementRef) {
        console.log(this);
        console.log(this.myDate);
        this.delta = (this.myDate);
    }
}

第一个console.log（this）返回正确的值：

TimeDeltaDirective对象{delta：undefined，myDate：＆＃34; 2016-09-20 00：00：00＆＃34;}

第二个返回：undefined

但为什么呢？在用myDate输出整个对象之前的一微秒，但是在访问this.myDate时它返回undefined。

请帮帮我。谢谢

Answer 1

@Inputs()在执行constructor()时尚未分配。

使用ngOnInit挂钩而不是构造函数

<击>

  constructor(renderer: Renderer, el: ElementRef) {
    console.log(this);
    console.log(this.myDate);
    this.delta = (this.myDate);
  }

<击>

constructor(renderer: Renderer, el: ElementRef) {}

ngOnChanges(...) {
  // inputs are updated
}

ngOnInit() {
  // executes after ngOnChanges was called the first time
  console.log(this);
  console.log(this.myDate);
  this.delta = (this.myDate);
}

指令输入/输出的Angular 2问题

1 个答案: