Angularjs如何自定义一个可输入的下拉框组件
发布时间：-12-28 10:20:32
来源：亿速云
阅读：106
作者：小新
小编给大家分享一下Angularjs如何自定义一个可输入的下拉框组件，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！
在 angularjs 中自定义一个可输入的下拉框组件，组件的创建及引入如下。
新建 insertSelect.html 文件
.insert-select{
position:relative;
}
.input-box{
position:absolute;
height:calc(100%-4px);
width:calc(100%-25px);
top:2px;
left:2px;
padding-left:10px;
outline:none!important;
border-radius:4px!important;
border:none!important;
}
chosenng-model="modelData"
ng-options="itemforiteminoptionList">
ng-attr-placeholder="{{placeholder}}"
ng-model="modelData">
directive 自定义指令//可输入select框
angular.module("controllers")
.directive("insertSelect",[function(){
return{
restrict:'AE',
templateUrl:'template/common/insertSelect.html',
scope:{
modelData:'=modelData',
optionList:'=optionList',
placeholder:'=placeholder',//placeholder可由引入页面传入
},
link:function($scope,$elem){
//
},
controller:["$scope",function($scope){
}]
}
}]);
页面引入 insertSelect 组件
option-list="successCodeList"
placeholder="'请选择'">
看完了这篇文章，相信你对“Angularjs如何自定义一个可输入的下拉框组件”有了一定的了解，如果想了解更多相关知识，欢迎关注亿速云行业资讯频道，感谢各位的阅读！
