Angular 指令从元素中删除原始属性答案

【问题标题】：Angular directive removes original attribute from elementAngular 指令从元素中删除原始属性
【发布时间】：2017-11-01 13:40:58
【问题描述】：

当在某些元素上添加指令时（例如img），并且如果该指令具有来自它的某些属性为@Input()（例如src），则原始属性将更改为ng-reflect-*（例如@987654326 @) 并且永远不会显示图像，因为没有 src 属性。

只有在必须评估 src 时才会发生这种情况，不会发生在固定网址上！

这是预期的行为还是错误？有可能让它工作吗？（目前我正在通过使用src 和source 并仅将source 作为指令的输入来解决它。）

可以在以下 plnkr 上看到示例（应该显示两张图片，但只有一张）：https://plnkr.co/edit/5AjZPeyEfd6IOqxQp3kq?p=preview

【问题讨论】：

【解决方案1】：

我认为这是预期的行为。

可能的解决方法如下

@HostBinding() @Input() src: string;

【讨论】：

你是对的，这确实有效，而且使用constructor(@Attribute('src') src: string) {} 可能还有更好的方法（此处提供github.com/angular/angular/issues/17138）
还有一个问题，为什么它只在评估值时才消耗src（即src="{{imgUrl}}"）而不是在硬编码值时（即src="some-pic.com/link123" )?