1. 程式人生 > >angularjs中,獲取預設選中的單選按鈕的value

angularjs中,獲取預設選中的單選按鈕的value

在Html頁面中,有三個單選按鈕,預設選中的是第二個“重要”這個選項,設定ng-checked="true",把該選項預設選中,可是在提交表單時,卻提示$scope.level為undefine狀態,明明預設選中了為什麼卻是undefine呢?
於是,先測試了一把:在Html頁面寫下下面的程式碼:
<div ng-controller="testCtrl">
    <div >
        <label >
            <input type="radio" value="Normal" ng-model="level" name="level"
            >一般
        </label>
        <label >
            <input type="radio" value="Important" ng-model="level" name="level"
                   ng-checked="true"
            >重要
        </label>
        <label >
            <input type="radio" value="Urgent" ng-model="level" name="level"
            >緊急
        </label>


    </div>
     <div> {{ level }}</div>               //顯示單選按鈕選中的value
</div>

頁面第一次載入,雖然“重要”這個單選按鈕是預設選中,但是頁面卻不顯示重要這個單選按鈕對應的value,



點選“緊急”按鈕,下面會顯示“緊急”按鈕的value,




原來,在頁面載入時,$scope.level沒有被賦值,沒有初始值,即便 ng-checked="true",卻也不顯示預設選中的值!需要在js中設定:$scope.level= "Important";這時,重新整理頁面,會預設顯示選中的按鈕的value: