ng-selected只能應用在option標簽上,就像ng-submit只能應用在form標簽上一樣。
ng-selected指令為select設置了指定的選中值,HTML規范不允許瀏覽器保存類似selected的布爾值屬性。如果我們將一個Angular的插入值表達式轉換為這樣的屬性,那么當瀏覽器刪除該屬性時,綁定信息就會丟失。這個指令不被瀏覽器刪除,並且提供了一個永久性的可靠的地方來存儲綁定信息。
今天學習ng-selected的時候,通過copy官網上的例子來實踐
click me to select radio:<input type="radio" name="name" ng-model="sel"/>
<p>{{sel}}</p>
click me to select checkbox: <input type="checkbox" ng-model="sel"/>
<select>
<option>Hello</option>
<option>World</option>
<option ng-selected="sel">greeting</option>
</select>
實踐過程中發現當選中checkbox時{{sel}}值是true,則option中greeting被選中。但是當選中radio時,greeting沒有被選中並且{{sel}}的值為空。
原因:type=radio的input沒有值,應給type=radio的input加上value值,則可以輸出{{sel}}的值,greeting也會被選中。
修改之后的代碼如下:
<input type="radio" name="name" ng-model="sel" value="male"/>male <input type="radio" name="name" ng-model="sel" value="female"/>female <p>{{sel}}</p> click me to select checkbox: <input type="checkbox" ng-model="sel"/> <select> <option>Hello</option> <option>World</option> <option ng-selected="sel">greeting</option> </select>
選中male這個單選框時,{{sel}}值為male,有值則ng-selected為true,greeting被選中。