ａｎｇｕｌａｒ２的模块语法

JavaScript中那些具有或可能引发副作用的表达式是被禁止的， 包括：<br>
赋值 (=, +=, -=, ...)<br>
new运算符<br>
使用;或,的链式表达式<br>
自增或自减操作符(++和--)<br>
和JavaScript语法的其它显著不同包括：<br>
不支持位运算 | 和 &<br>
具有新的 模板表达式运算符， 比如|和?.<br>
模板表达式不能引用全局命名空间中的任何东西。 它们不能引用window或document。 它们不能调用console.log或Math.max。 它们被
局限于只能访问来自表达式上下文中的成员。<br>
一旦我们开始数据绑定， 我们就不再跟Attribute打交道了。 我们并不是在设置<br>
Attribute， 而是在设置DOM元素、 组件和指令的Property。
<br>
插值表达式：
<p>
  {{12+45+12*10000}}
  <br>
  12+45+12*10000
</p>


数据绑定:
<!-- Bind button disabled state to `isUnchanged` property --><br>
<button [disabled]="isUnchanged">Save</button>

<br>
属性绑定：
<img [src]="heroImageUrl">
<br>
我们通常得在插值表达式和属性绑定之间做出选择。 下列这几对绑定做的事情完全相同：
<p><img src="{{heroImageUrl}}"> is the <i>插值表达式</i> image.</p><br>
<p><img [src]="heroImageUrl"> is the <i>属性绑定</i> image.</p><br>
在多数情况下， 插值表达式是一个更方便的备选项。 实际上， 在渲染视图之前， Angular就把这些插值表达式翻译成了对应的属性绑定形式
<br>
没有技术上的理由能决定哪种形式更好。 我们倾向于可读性， 所以倾向于插值表达式。 我们建议建立组织级的代码风格规定， 然后选择一种形式， 既能遵循
规则， 又能让手头的任务做起来更自然。
<br>
Attribute绑定<br>
我们通篇都在说通过属性绑定来设置元素的属性总是好于用字符串设置Attribute。 为什么Angular还提供了Attribute绑定呢
<br>
因为当元素没有属性可绑的时候， 我们不得不使用Attribute绑定。
<br>
<table border=1>
  <!-- expression calculates colspan=2 -->
  <tr><td [attr.colspan]="1 + 1">One-Two</td></tr>
  <!-- ERROR: There is no `colspan` property to set!
  <tr><td colspan="{{1 + 1}}">Three-Four</td></tr>
  -->
  <tr><td>Five</td><td>Six</td></tr>
</table>
<br>
CSS类绑定:
<br>
<!-- toggle the "special" class on/off with a property -->
<div [class.special]="isSpecial">The class binding is special</div>
<!-- binding to `class.special` trumps the class attribute -->
<div class="special"
     [class.special]="!isSpecial">This one is not so special</div>
<br>
样式绑定：
<br>
<button [style.color] = "isSpecial ? 'red': 'green'">Red</button>
<button [style.background-color]="canSave ? 'cyan': 'grey'" >Save</button><br>
有些样式绑定中的样式带有单位。 在这里， 我们可以根据条件用“em”和“%”来设置字体大小的单位。<br>
<button [style.font-size.em]="isSpecial ? 3 : 1" >Big</button>
<button [style.font-size.%]="!isSpecial ? 150 : 50" >Small</button>
<br>
事件绑定:
<br>
事件绑定语法由等号左侧带圆括号的目标事件， 和右侧一个引号中的模板语句组成。 下列事件绑定监听按钮的点击事件。 无论什么时候， 发生点击时， 都会
调用组件的onSave()方法。<br>
<button (click)="onSave()">Save</button><br>
有些人更喜欢带on-前缀的备选形式， 称之为规范形式：<br>
<button on-click="onSave()">On Save</button><br>
<br>
<h3>$event和事件处理语句</h3><br>
<input [value]="currentHero.firstName"
       (input)="currentHero.firstName=$event.target.value" ><br>
我们在把输入框的value绑定到firstName属性， 并且我们正在通过绑定到输入框的input事件来监听更改。 当用户造成更改时， input事件被触发， 并且在
一个包含了DOM事件对象的$event的上下文中执行这条语句。<br>