angularjs 動(dòng)態(tài)從后臺(tái)獲取下拉框的值方法
angularjs 動(dòng)態(tài)從后臺(tái)獲取下拉框的值,只要是使用repeat指令,后臺(tái)提供的是一個(gè)list的對(duì)象,里面包含value和顯示的值,如下:
js文件:
//職務(wù)等級(jí)和檔次/軍銜等級(jí)和檔次,需要從后臺(tái)獲取:poslist,type:2/3/4/5 $scope.getDyActivityInforItems=function(){ serviceData.getData('inforinput/getAllSelectValueByType','POST',{ type:2 }).then(function(json){ if(json.code==0){ $scope.poslist=json.content; }; }, function(json){ console.log(json); }); };
界面:
<!-- 空格空開來(lái)區(qū)分職務(wù)等級(jí) --> <div class="item" style="border-top: 1px solid #ddd;padding-top: 2px;"> <label class="list_tit">職務(wù)等級(jí)</label> <div class="item_input" ng-init="getDyActivityInforItems()"> <!-- <select class="fillIn select-able" ng-model="item" ng-options="item as y for y in addInfo.posList" id="dutLevel_view_1" name="dutLevel"> </select> --> <select class="fillIn select-able" ng-model="selectedPos" id="dutLevel_view_1" name="dutLevel"> <option ng-repeat="x in poslist" value="{{x.select_code}}">{{x.select_name}}</option> </select> <span class="imp_list_rema">*</span> <!-- <select class="fillIn select-able" ng-model="addInfo.addInfoView.positionRank" > <option value="" selected>請(qǐng)選擇</option> </select> --> </div> </div>
===============分割線,2017年7月20日17:07:14-============
后面遇到一個(gè)問(wèn)題,當(dāng)新增了一個(gè)下拉選項(xiàng),需要刷新了下拉的list,但就會(huì)默認(rèn)顯示第一個(gè),沒(méi)有獲取剛開始顯示界面的值,需要使用apply進(jìn)行更新:
addInfo.addInfoView.positionRank=0; $scope.poslist=json.content; setTimeout(function() { $scope.$apply(function() { addInfo.addInfoView.positionRank=yuanPos; }); }, 1000);
html上:
<!-- 空格空開來(lái)區(qū)分職務(wù)等級(jí) --> <div class="item" style="border-top: 1px solid #ddd;padding-top: 2px;"> <label class="list_tit">職務(wù)等級(jí)</label> <div class="item_input" ng-init="getPosMilSelectValue()"> <select class="fillIn select-able" ng-selected="addInfo.addInfoView.positionRank" ng-model="addInfo.addInfoView.positionRank" id="dutLevel_view_1" name="dutLevel"> <option ng-repeat="x in poslist" value="{{x.select_code}}">{{x.select_name}}</option> </select> <span class="imp_list_rema">*</span> <span style="background:#3cb671;margin-left:20px;height:17px;width:20px" ng-click="addInfo.viewInput_add_item=!addInfo.viewInput_add_item;addInfo.addItemName='';selectType=2"> <a style="margin-left:7px;margin-top:2px" href="javascript:;" rel="external nofollow" title=""> + </a></span> </div> </div>
以上這篇angularjs 動(dòng)態(tài)從后臺(tái)獲取下拉框的值方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
- AngularJS動(dòng)態(tài)生成select下拉框的方法實(shí)例
- angularJs-$http實(shí)現(xiàn)百度搜索時(shí)的動(dòng)態(tài)下拉框示例
- AngularJS中下拉框的高級(jí)用法示例
- AngularJS中下拉框的基本用法示例
- Angularjs實(shí)現(xiàn)下拉框聯(lián)動(dòng)的示例代碼
- angularjs下拉框空白的解決辦法
- angularjs 實(shí)現(xiàn)帶查找篩選功能的select下拉框?qū)嵗?/a>
- Angularjs實(shí)現(xiàn)帶查找篩選功能的select下拉框示例代碼
- AngularJS使用ng-repeat指令實(shí)現(xiàn)下拉框
- AngularJS實(shí)現(xiàn)多級(jí)下拉框
相關(guān)文章
Angular.js之作用域scope''@'',''='',''&''實(shí)例詳解
這篇文章主要介紹了Angular.js之作用域scope'@','=','&'實(shí)例詳解,需要的朋友可以參考下2017-02-02AngularJS實(shí)現(xiàn)Model緩存的方式
這篇文章主要介紹了AngularJS實(shí)現(xiàn)Model緩存的方式,分享了多種AngularJS實(shí)現(xiàn)Model緩存的方法,感興趣的小伙伴們可以參考一下2016-02-02詳解Angular5/Angular6項(xiàng)目如何添加熱更新(HMR)功能
這篇文章主要介紹了詳解Angular5/Angular6項(xiàng)目如何添加熱更新(HMR)功能,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-10-10詳解Angular數(shù)據(jù)綁定及其實(shí)現(xiàn)方式
數(shù)據(jù)綁定是將應(yīng)用程序UI或用戶界面綁定到模型的機(jī)制。使用數(shù)據(jù)綁定,用戶將能夠使用瀏覽器來(lái)操縱網(wǎng)站上存在的元素。2021-05-05AngularJS 獲取ng-repeat動(dòng)態(tài)生成的ng-model值實(shí)例詳解
這篇文章主要介紹了AngularJS 獲取ng-repeat動(dòng)態(tài)生成的ng-model值實(shí)例詳解的相關(guān)資料,這里提供實(shí)例代碼及實(shí)現(xiàn)效果圖,需要的朋友可以參考下2016-11-11AngularJS實(shí)現(xiàn)的生成隨機(jī)數(shù)與猜數(shù)字大小功能示例
這篇文章主要介紹了AngularJS實(shí)現(xiàn)的生成隨機(jī)數(shù)與猜數(shù)字大小功能,結(jié)合完整實(shí)例形式分析了AngularJS隨機(jī)數(shù)生成與數(shù)值判定相關(guān)操作技巧,需要的朋友可以參考下2017-12-12