国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 語言 > JavaScript > 正文

angularjs下拉框空白的解決辦法

2024-05-06 15:15:41
字體:
來源:轉載
供稿:網友

搜索angularjs下拉框空白,可以出現很多解決方案,但是對于靜態字段來說,網上目前還沒有找到解決方案,如下:

<select class="form-control" ng-model="UserState"  ng-init="UserState=0"> <option value="-1">選擇狀態</option> <option value="0">在職</option> <option value="1">離職</option> </select>

  如果要按照網上的方法來解決,首先需要把下拉選項存放到一個對象數組當中,對于一個兩個下拉框還好說,如果項目當中有很多這種下拉框,就要費好大勁了。最簡單粗暴的方法是修改angularjs源代碼,不再生成空白符。奈何功力有限,未能找到相應添加空白行的地方,不過值得欣慰的是,發現出現空白符是因為使用了ng-model的原因,干脆寫個指令來替代ng-model的功能也可以解決下拉空白的問題,于是寫了一個指令:

app.directive("dModel",function () {  return {   restrict:'A',   compile:function(element, attrs, transclude){    console.log(transclude);    var dModel=attrs["dModel"];    return{     pre:function(scope, iElement, iAttrs){      var selectValue=scope[dModel]+"";      if(selectValue)      {       var options=element.children();       for(var i=0;i<options.length;i++)       {        if(selectValue==options[i].value)        {         options[i].setAttribute("selected",true);         break;        }       }      }     },     post:function(scope, iElement, iAttrs){      element.on("change",function () {       var selectValue=this.value;       scope.$apply(function () {        scope[dModel]= selectValue;       });      })     }    }   }  } });

   用該指令替代ng-model即可實現相同的功能,同時不會出現下拉空白,當然,這個指令畢竟是自己隨便寫的幾行代碼,遠遠不如ng-model強大,比如動態修改指令綁定的值來改變選中項還不能實現,僅僅可以在第一次初始化時綁定選中項,另外也不支持ng-selected。如果讀者有興趣,可以自己實現后續的功能,對于我來說,已經可以滿足需要了。

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持錯新站長站。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表

圖片精選

主站蜘蛛池模板: 安福县| 东乌| 庆城县| 富源县| 建湖县| 金坛市| 钟山县| 抚远县| 荥经县| 嘉兴市| 中牟县| 鄱阳县| 大同市| 永安市| 临江市| 乡城县| 榆林市| 乐业县| 湖南省| 精河县| 阳朔县| 无极县| 南澳县| 富顺县| 财经| 江油市| 吴川市| 威海市| 大渡口区| 瓦房店市| 剑阁县| 德化县| 玛曲县| 望谟县| 宁津县| 桃园市| 绥中县| 武宁县| 屏南县| 永和县| 城市|