首頁 >web前端 >js教程 >在angularjs中取得預設選取的單選按鈕的value方法(詳細教學)

在angularjs中取得預設選取的單選按鈕的value方法(詳細教學)

亚连
亚连原創
2018-06-02 17:45:142187瀏覽

下面我就為大家分享一篇angularjs 取得預設選取的單選按鈕的value方法,具有很好的參考價值,希望對大家有幫助。

在Html頁面中,有三個單選按鈕,預設選取的是第二個「重要」這個選項,設定ng-checked="true",把該選項預設選中,可是在提交表單時,卻提示$scope.level為undefine狀態,明明預設選取了為什麼卻是undefine呢?

於是,先測試了一把:在Html頁面寫下下面的程式碼:

<span style="font-size:18px;"><p ng-controller="testCtrl"> 
 <p > 
  <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> 
 
 
 </p> 
  <p> {{ level }}</p>    //显示单选按钮选中的value 
</p></span>

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

#點擊「緊急」按鈕,下面會顯示「緊急」按鈕的value,

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

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

vue 實作的樹形菜的實例代碼

p5.js入門教程之鍵盤互動

VUE重點問題總結

以上是在angularjs中取得預設選取的單選按鈕的value方法(詳細教學)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn