Angular 2 属性 绑定到底是如何工作的？这个例子中到底发生了什么？
How exactly works the Angular 2 property binding? What really happens in this example?
我是 Angular 2 的绝对初学者，我对 属性 绑定有以下疑问。
这个例子有效，但我对幕后到底发生了什么有疑问。
我有一个包含此按钮的组件视图（servers.component.html 文件）：
<button [disabled]="!allowNewServer" class="btn btn-primary">Add Server</button>
相关组件是：
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-servers',
templateUrl: './servers.component.html',
styleUrls: ['./servers.component.css']
})
export class ServersComponent implements OnInit {
allowNewServer = false;
constructor() {
setTimeout(() => {
this.allowNewServer = true;
}, 8000);
}
ngOnInit() {
}
}
如您所见，一开始 allowNewServer 的值为 false，8 秒后设置为 true 通过在构造函数中声明的函数。
在我的按钮上设置了这个 disabled 属性：
[disabled]="!allowNewServer"
所以一开始按钮是禁用的，8秒后它会启用。
慕的疑惑是：
1) [...] Angular 语法的确切含义是什么？
2) 我预计渲染结果类似于 disabled=true（在开始时），8 秒后呈现类似于 disabled=dalse，但 8 秒后 disable 属性被删除。所以我认为我不理解 [...] 语法的意思。
[...] 语法用于 属性 绑定。更多信息 here.
我建议您遵循 Google 制作的英雄之旅教程。它解释了 Angular (v2,v4) 的基础知识，并帮助您创建您的第一个很酷的应用程序。你可以找到它 here.
[] 语法告诉 angular 从数据中绑定信息
源（组件实例）与模板 (html).- 你的问题是什么？
回答你的问题
[...] Angular 语法的确切含义是什么？
以上语法用于数据绑定。正如官方文档所说。
Write a template property binding to set a property of a view element. The binding sets the property to the value of a template expression.An element property between enclosing square brackets identifies the target property
回答你第二个问题
我预计会呈现类似 disabled=true 的内容（在开始时），8 秒后会呈现类似 disabled=false 的内容，但 8 秒后只会删除 disable 属性。所以我认为我不理解 [...] 语法的含义。
[disabled]="!allowNewServer"
这行 cod 将根据 allowNewServer 将禁用属性设置为 true 或 false。但是 disabled 是一个布尔属性，即仅表示该属性的存在表示其设置为 true，不存在表示它为 false。官方文档说
A number of attributes are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.
因此，当该值设置为 false（不被视为有效值）时，angular 会删除该属性，因为它认为不存在意味着 false。因此行为。
供参考：
希望对您有所帮助:)
对于 #2 - 您的假设适用于大多数 html 和自定义属性。但是 disabled 是特例。 HTML 规范期望该属性对于禁用元素没有值，对于其余情况则没有。 IE。 <input disabled="true"> 不是编码 HTML 的正确方法。此外，当您有 <input disabled="false"> 时，大多数浏览器将禁用您的字段。这就是 angular 删除它的原因。
我是 Angular 2 的绝对初学者，我对 属性 绑定有以下疑问。
这个例子有效，但我对幕后到底发生了什么有疑问。
我有一个包含此按钮的组件视图（servers.component.html 文件）：
<button [disabled]="!allowNewServer" class="btn btn-primary">Add Server</button>
相关组件是：
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-servers',
templateUrl: './servers.component.html',
styleUrls: ['./servers.component.css']
})
export class ServersComponent implements OnInit {
allowNewServer = false;
constructor() {
setTimeout(() => {
this.allowNewServer = true;
}, 8000);
}
ngOnInit() {
}
}
如您所见，一开始 allowNewServer 的值为 false，8 秒后设置为 true 通过在构造函数中声明的函数。
在我的按钮上设置了这个 disabled 属性：
[disabled]="!allowNewServer"
所以一开始按钮是禁用的，8秒后它会启用。
慕的疑惑是：
1) [...] Angular 语法的确切含义是什么？
2) 我预计渲染结果类似于 disabled=true（在开始时），8 秒后呈现类似于 disabled=dalse，但 8 秒后 disable 属性被删除。所以我认为我不理解 [...] 语法的意思。
[...] 语法用于 属性 绑定。更多信息 here.
我建议您遵循 Google 制作的英雄之旅教程。它解释了 Angular (v2,v4) 的基础知识，并帮助您创建您的第一个很酷的应用程序。你可以找到它 here.
[]语法告诉 angular 从数据中绑定信息 源（组件实例）与模板 (html).- 你的问题是什么？
回答你的问题
[...] Angular 语法的确切含义是什么？
以上语法用于数据绑定。正如官方文档所说。
Write a template property binding to set a property of a view element. The binding sets the property to the value of a template expression.An element property between enclosing square brackets identifies the target property
回答你第二个问题
我预计会呈现类似 disabled=true 的内容（在开始时），8 秒后会呈现类似 disabled=false 的内容，但 8 秒后只会删除 disable 属性。所以我认为我不理解 [...] 语法的含义。
[disabled]="!allowNewServer"
这行 cod 将根据 allowNewServer 将禁用属性设置为 true 或 false。但是 disabled 是一个布尔属性，即仅表示该属性的存在表示其设置为 true，不存在表示它为 false。官方文档说
A number of attributes are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.
因此，当该值设置为 false（不被视为有效值）时，angular 会删除该属性，因为它认为不存在意味着 false。因此行为。
供参考：
希望对您有所帮助:)
对于 #2 - 您的假设适用于大多数 html 和自定义属性。但是 disabled 是特例。 HTML 规范期望该属性对于禁用元素没有值，对于其余情况则没有。 IE。 <input disabled="true"> 不是编码 HTML 的正确方法。此外，当您有 <input disabled="false"> 时，大多数浏览器将禁用您的字段。这就是 angular 删除它的原因。