角度2:未接收输入值的属性指令

Question

我已经创建了一个heatMap属性指令，它在调用时传递时不会接收到值。

HeatMap指令：

import {Directive, ElementRef, Input, Renderer, OnInit} from "@angular/core";

@Directive({
    selector: '[HeatMap]',
})

export class HeatMapDirective{

    @Input('startVal') public startVal: string;

    constructor(private el: ElementRef, private renderer: Renderer) {
        this.processHeatMap();
    }

    processHeatMap() {
     console.log(this.startVal); // prints undefined.
    }
}

HTML元素：

    <td class="pad-10" [startVal]="'25'" HeatMap> 25 </td>

我有一个场景，我需要同时传递字符串和数值，但两者都不起作用。我是不是遗漏了什么？

Answer 1

将html更改为：

<td class="pad-10" [startVal]="'25'" HeatMap> 25 </td>

Answer 2

当从构造函数对输入值进行寻址时，输入值还没有初始化，从ngOnInit()中对它们进行寻址，如下所示：

ngOnInit() {
  this.processHeatMap();
}