Question

显然，我的目标是在使用角度指令后使<input type="text" placeholder="example" />看起来像<input type="text" [placeholder]="'example'" />一样的元素

import { Directive, HostBinding } from '@angular/core';

@Directive({
  selector: 'input[placeholder]'
})
export class PlaceholderDirective {
  @HostBinding('placeholder') placeholder:string;
  constructor() {
  }
}

但我现在不知道如何在没有placeholder="A placeholder"值的[placeholder]中首先设置undefined。

Answer 1

好的，我通过询问和写出问题来回答自己，但是这里是为那些会问自己的人：我导入ElementRef以访问原始占位符值并直接在constructor中设置！

import { Directive, HostBinding, ElementRef} from '@angular/core';

@Directive({
  selector: 'input[placeholder]'
})
export class PlaceholderDirective{
  @HostBinding('placeholder') placeholder:string;
  constructor(elementRef: ElementRef) {
    this.placeholder = elementRef.nativeElement.placeholder;
  }
}

使一个简单的DOM属性成为指令中的单向绑定

1 个答案: