如何使用Angular 2+；中的指令获取图像src值；？

从标题开始，我想了解如何使用目录获取图像src值

指令：

@Directive({
    selector: '[appLazyImage]',
})
export class LazyImageDirective implements OnInit {

    @HostBinding('src') public src: string;
    @Input() private appLazyImage: string;

    constructor() {}

    public ngOnInit() {
        //this.src is undefined
        console.log(this.appLazyImage, this.src);
    }

}

Html:

---

使用ElementRef服务获取Src属性

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

@Directive({
  selector: '[appSrc]'
})
export class SrcDirective {

  constructor(private el: ElementRef) {
    console.log(this.el.nativeElement.src);
  }

}

---

使用

nativeElement

获取属性值

 constructor(elm: ElementRef) {
    let src = elm.nativeElement.getAttribute('src'); 
  }

---

使用HostBinding，我们可以从指令中分配主机元素属性。示例：@Chellappan你是什么意思？您的示例没有指令。

 constructor(elm: ElementRef) {
    let src = elm.nativeElement.getAttribute('src'); 
  }