Angular 为什么[myHighlight]="&引用;是否为属性指令工作?

Angular 为什么[myHighlight]="&引用;是否为属性指令工作?,angular,angular2-directives,Angular,Angular2 Directives,中的myHighlight属性指令使用myHighlight名称作为属性选择器: selector: '[myHighlight]', 和一个输入属性: @Input('myHighlight') highlightColor: string; 我发现我们不必像这样指定选择器属性很奇怪/违反直觉(尽管如果我们这样编写,它仍然有效): accessKey是一个HTML元素属性还是一个属性指令,其输入属性也被命名为accessKey?(仅供参考,accessKey是有效的HTML元素属性,因此此

中的
myHighlight
属性指令使用
myHighlight
名称作为属性选择器:

selector: '[myHighlight]',
和一个输入属性:

@Input('myHighlight') highlightColor: string;
我发现我们不必像这样指定选择器属性很奇怪/违反直觉(尽管如果我们这样编写,它仍然有效):

accessKey
是一个HTML元素属性还是一个属性指令,其输入属性也被命名为
accessKey
?(仅供参考,
accessKey
是有效的HTML元素属性,因此此示例不是属性指令。)

回到highlight指令。。。如果我将输入属性名称更改为
highlightColor

@Input() highlightColor: string;
然后,我必须指定属性选择器和属性绑定,我发现它们不那么模棱两可:

<span myHighlight [highlightColor]="color">highlight me</span>
突出显示我
因此,“快捷方式”似乎只有在输入属性名称与属性选择器匹配时才起作用

更新:似乎使用了相同的技巧/快捷方式。例如:

<p *ngIf="condition">
  text here
</p>

此处文本

相当于

<template [ngIf]="condition">  <--- binds input property ngIf to NgIf directive, not to template
  <p>
    text here
  </p>
</template>
在会议上,我和其中一位名叫Alex Rickabaugh的人谈了我的担忧。他指出,这种语法在其他方面也是模棱两可的。例如,我们讨论了以下语法:

<my-comp [whatIsThis]="someProperty">

如果
whatIsThis
是一个具有相同名称的输入属性的指令,或者
whatIsThis
my comp
组件的输入属性,我们无法从阅读HTML中分辨出来


我想底线是,对于Angular 2,我们不能简单地查看HTML来了解正在发生的绑定类型。我们必须了解应用程序使用的指令和组件。糟糕。

我刚看了一下医生。这里有一些微妙的东西:“这个@Input装饰器将元数据添加到类中,使highlightColor属性可用于myHighlight别名下的属性绑定”。还有:这只是一种可能。您可以使用一个更适合您的。我认为这也可能是相关的。对于那些想知道如果组件具有与指令相同的命名方式的输入属性会发生什么的人,那么指令和组件都将获得属性值。是的,令人困惑。
<p *ngIf="condition">
  text here
</p>
<template [ngIf]="condition">  <--- binds input property ngIf to NgIf directive, not to template
  <p>
    text here
  </p>
</template>
<my-comp [whatIsThis]="someProperty">