AngularJS單選框及多選框實現雙向動態綁定_AngularJS

一、ng-model

ng-model指令用來將input、select、textarea或自定義表單控件同包含它們的作用域中的屬性進行綁定。它將當前作用域中運算表達式的值同給定的元素進行綁定。如果屬性不存在，它會隱式創建并將其添加到當前作用域中。
始終用ng-model來綁定scope上一個數據模型內的屬性，而不是scope上的屬性，這可以避免在作用域或后代作用域中發生屬性覆蓋！

二、type=”radio”

通過 value 屬性指定選中狀態下對應的值，并通過 ng-model 將單選框與 $scope 中的屬性對應，便實現了 type=”radio” 時的雙向動態綁定。

男
女

三、type=”checkbox”

通過AngularJS 的內置指令 ng-true-value 和 ng-false-value ，指定多選框在選中和未選中狀態下對應的值，再通過ng-model 將其與 $scope 中的屬性對應，便實現了type=”checkbox” 的雙向動態綁定。

乒乓球
足球
籃球

四、完整示例

 
 
 
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

AngularJS單選框及多選框實現雙向動態綁定_AngularJS

AngularJS單選框及多選框實現雙向動態綁定_AngularJS:在AngularJS中提及雙向數據綁定，大家肯定會想到ng-model指令。 一、ng-model ng-model指令用來將input、select、textarea或自定義表單控件同包含它們的作用域中的屬性進行綁定。它將當前作用域中運算表達式的值同給定的元素進行綁定。如果屬性不存在，它會隱

推薦度：

點擊下載本文 文檔為doc格式