下面本篇文章给大家介绍一下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;
}
chosen ng-model="modelData"
ng-options="item for item in optionList">
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="'请选择'">
更多编程相关知识，请访问：编程教学！！
