angular 的 select 中 ng-options 設置默認值

omgdog 發布于2019-08-20 12:29 / 3178人閱讀

摘要：的中設置默認值在開發的后臺系統中，經常需要對后臺數據進行修改，而在修改數據的過程中，若頁面中有下拉框，需要讓其選中原來的數據，即中需要設置默認值。默認值設置方法在中使用綁定數據，在對應的中定義全局數據，并為其賦值，該值即為的默認值。

angular 的 select 中 ng-options 設置默認值

在AngularJS 開發的后臺web系統中，經常需要對后臺數據進行修改，而在修改數據的過程中，若頁面中有select下拉框，需要讓其選中原來的數據，即select中需要設置默認值。

默認值設置方法：

在select中使用ng-model綁定數據myColor，

在對應的controller中定義ng-model全局數據$scope.myColor，并為其賦值，該值即為select的默認值。

代碼如下：

angular.module("myApp", [])
  .controller("MyController", ["$scope"], function($scope) {
    $scope.colors = ["black", "white", "red", "blue", "yellow"];
    
    $scope.myColor = $scope.colors[2];
  })

顯示效果：

說明：該文檔參考angular官方api

云服務器 GPU云服務器 select默認值 input設置默認值 js函數設置默認值 js框中如何默認值

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81008.html

angular.js ng-options的正確打開姿勢

摘要：直接上代碼商品其中后面的為的值，用于顯示選項名稱。請求失敗執行代碼直接上代碼商品: 其中 track by 后面的為option的value值， g.name用于顯示選項名稱。 var app = angular.module(myApp, []); app.controller(goodsCt...

Profeel 2019-08-21 18:34 評論0 收藏0
AngularJS: 使用ng-option生成下拉框并在controller調用

摘要：寫的時候碰到很多問題，因為剛開始用，寫法思路還是和寫相似，導致與在一個生成下拉框時花費了個小時才最終搞定。不自覺的用自己所熟悉的方式思考問題，付出了慘重的代價實在是不能對jquery的ajax方法和基于頁面dom的各種取值、傳值方法滿意（雖然jquery已經解救過我一次了），剛好手上這個項目用jquery的方法寫了一半，決定試試很久以前自學的angularJS，把現在項目中jquer...

huaixiaoz 2019-08-19 14:38 評論0 收藏0
angularjs初識

摘要：總的來說，收獲很大。這里這里就以一些常用的標簽談談中的基礎知識。然后還有一個表示記錄的索引號，從開始。已經用這個數組的值替他們分好了組了，是不是感覺很強大，還有很多強大的地方等著我們去學習，掌握它，還有更強大的等著我們。周三的時候跟著老師簡單的入門了angularjs，然后去圖書館找了一本《Angularjs實戰》來看了看，雖然這本書網上的評價不太高，但對于初學者的我來說還是不錯的，...

tanglijun 2019-08-23 11:49 評論0 收藏0
AngularJS簡述

流行框架簡介 angularjs是一款非常優秀的前端高級JS框架，由谷歌團隊開發維護，能夠快速構建單頁web應用，化繁為簡無論是angularjs還是jQuery都是用原生JS封裝的庫：對代碼進行封裝，調用封裝的方法，簡化操作傳統方式是用get方式獲取元素，然后點方法 jQuery庫實現了對獲取方式的封裝，對方法的封裝框架：提供代碼書寫規則，按照規則去寫代碼，框架會幫我們實現響應的功能...

Jason 2019-08-23 11:25 評論0 收藏0
Angular實現的網上商城SKU組合查詢組件

摘要：最近學習了，正好又完整的做了一個電商網站，就利用實現了一個組合查詢組件，首先介紹是個什么東西。庫存量單位，即庫存進出計量的單位，可以是以件盒托盤等為單位。在服裝鞋類商品中使用最多最普遍。最近學習了angular，正好又完整的做了一個電商網站，就利用angular實現了一個sku組合查詢組件，首先介紹sku是個什么東西。sku=stock keeping unit(庫存量單位)，sku...

mcterry 2019-08-21 10:42 評論0 收藏0