angular 的 select 中 ng-options 設(shè)置默認(rèn)值

omgdog 發(fā)布于2019-08-20 12:29 / 3189人閱讀

摘要：的中設(shè)置默認(rèn)值在開(kāi)發(fā)的后臺(tái)系統(tǒng)中，經(jīng)常需要對(duì)后臺(tái)數(shù)據(jù)進(jìn)行修改，而在修改數(shù)據(jù)的過(guò)程中，若頁(yè)面中有下拉框，需要讓其選中原來(lái)的數(shù)據(jù)，即中需要設(shè)置默認(rèn)值。默認(rèn)值設(shè)置方法在中使用綁定數(shù)據(jù)，在對(duì)應(yīng)的中定義全局?jǐn)?shù)據(jù)，并為其賦值，該值即為的默認(rèn)值。

angular 的 select 中 ng-options 設(shè)置默認(rèn)值

在AngularJS 開(kāi)發(fā)的后臺(tái)web系統(tǒng)中，經(jīng)常需要對(duì)后臺(tái)數(shù)據(jù)進(jìn)行修改，而在修改數(shù)據(jù)的過(guò)程中，若頁(yè)面中有select下拉框，需要讓其選中原來(lái)的數(shù)據(jù)，即select中需要設(shè)置默認(rèn)值。

默認(rèn)值設(shè)置方法：

在select中使用ng-model綁定數(shù)據(jù)myColor，

在對(duì)應(yīng)的controller中定義ng-model全局?jǐn)?shù)據(jù)$scope.myColor，并為其賦值，該值即為select的默認(rèn)值。

代碼如下：

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

顯示效果：

說(shuō)明：該文檔參考angular官方api

云服務(wù)器 GPU云服務(wù)器 select默認(rèn)值 input設(shè)置默認(rèn)值 js函數(shù)設(shè)置默認(rèn)值 js框中如何默認(rèn)值

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/81008.html

相關(guān)文章

angular.js ng-options的正確打開(kāi)姿勢(shì)

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

Profeel 2019-08-21 18:34 評(píng)論0 收藏0
AngularJS: 使用ng-option生成下拉框并在controller調(diào)用

摘要：寫(xiě)的時(shí)候碰到很多問(wèn)題，因?yàn)閯傞_(kāi)始用，寫(xiě)法思路還是和寫(xiě)相似，導(dǎo)致與在一個(gè)生成下拉框時(shí)花費(fèi)了個(gè)小時(shí)才最終搞定。不自覺(jué)的用自己所熟悉的方式思考問(wèn)題，付出了慘重的代價(jià) 實(shí)在是不能對(duì)jquery的ajax方法和基于頁(yè)面dom的各種取值、傳值方法滿意（雖然jquery已經(jīng)解救過(guò)我一次了），剛好手上這個(gè)項(xiàng)目用jquery的方法寫(xiě)了一半，決定試試很久以前自學(xué)的angularJS，把現(xiàn)在項(xiàng)目中jquer...

huaixiaoz 2019-08-19 14:38 評(píng)論0 收藏0
angularjs初識(shí)

摘要：總的來(lái)說(shuō)，收獲很大。這里這里就以一些常用的標(biāo)簽談?wù)勚械幕A(chǔ)知識(shí)。然后還有一個(gè)表示記錄的索引號(hào)，從開(kāi)始。已經(jīng)用這個(gè)數(shù)組的值替他們分好了組了，是不是感覺(jué)很強(qiáng)大，還有很多強(qiáng)大的地方等著我們?nèi)W(xué)習(xí)，掌握它，還有更強(qiáng)大的等著我們。周三的時(shí)候跟著老師簡(jiǎn)單的入門了angularjs，然后去圖書(shū)館找了一本《Angularjs實(shí)戰(zhàn)》來(lái)看了看，雖然這本書(shū)網(wǎng)上的評(píng)價(jià)不太高，但對(duì)于初學(xué)者的我來(lái)說(shuō)還是不錯(cuò)的，...

tanglijun 2019-08-23 11:49 評(píng)論0 收藏0
AngularJS簡(jiǎn)述

流行框架簡(jiǎn)介 angularjs是一款非常優(yōu)秀的前端高級(jí)JS框架，由谷歌團(tuán)隊(duì)開(kāi)發(fā)維護(hù)，能夠快速構(gòu)建單頁(yè)web應(yīng)用，化繁為簡(jiǎn) 無(wú)論是angularjs還是jQuery都是用原生JS封裝的庫(kù)：對(duì)代碼進(jìn)行封裝，調(diào)用封裝的方法，簡(jiǎn)化操作傳統(tǒng)方式是用get方式獲取元素，然后點(diǎn)方法 jQuery庫(kù)實(shí)現(xiàn)了對(duì)獲取方式的封裝，對(duì)方法的封裝框架：提供代碼書(shū)寫(xiě)規(guī)則，按照規(guī)則去寫(xiě)代碼，框架會(huì)幫我們實(shí)現(xiàn)響應(yīng)的功能...

Jason 2019-08-23 11:25 評(píng)論0 收藏0
Angular實(shí)現(xiàn)的網(wǎng)上商城SKU組合查詢組件

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

mcterry 2019-08-21 10:42 評(píng)論0 收藏0