在带有模板字符串的指令中使用innerHTML

时间:2018-01-13 10:26:52

标签: angular

我有一个指令,可以在设置加载状态时更改按钮的文本。我希望它在innerHTML是模板字符串时起作用。有任何想法吗?

例如:

<button [buttonLoader]="loading" buttonLoaderText="Loading...">Hello {{plant}}</button>

目前只显示Hello

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

@Directive({
  selector: '[buttonLoader]'
})

export class ButtonLoaderDirective {

  @Input('buttonLoader') loading
  @Input('buttonLoaderText') loadingText: string

  origEl: string

  constructor (private _el: ElementRef) {
  }

  ngOnInit () {

    this.origEl = this._el.nativeElement.innerHTML

    this.loading && this.loading
      .subscribe((value) => {
        let changeTo = (value ? this.loadingText || 'Loading...' : this.origEl)
        this._el.nativeElement.innerHTML = changeTo
      })

  }

}

0 个答案:

没有答案
相关问题