<!DOCTYPE html>
<html>
<head lang="zh_CN">
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js" type="text/javascript"></script>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body >
<div ng-app="myApp" ng-controller="myCtrl">
<input type="text" style="width:300px;display: block;" ng-model="selectVague" ng-click="hidden=!hidden" ng-change="selectVagueChange(selectVague)">
<select ngc-select-search style="width: 300px;" name="" id="" multiple ng-hide="hidden" ng-change="searchChange(selectData)" ng-model="selectData" ng-options="m.name for m in datas" ng-click="hidden=!hidden"></select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope,$http) {
$scope.datas = [
{id:"1",name:"dsadasdas"},
{id:"2",name:"1111"},
{id:"3",name:"222"},
{id:"4",name:"eeee"},
{id:"5",name:"ddddd"},
];
$scope.tempdatas = $scope.datas;
$scope.selectVague = "";
$scope.hidden = true;
/*input框发生变化时监听值*/
$scope.selectVagueChange = function(val){
console.log(val);
var newArr= [];
if(val){
angular.forEach($scope.datas,function(item){
console.log(item.name);
if(item.name.indexOf(val)!= -1){
console.log(item);
newArr.push(item);
};
});
$scope.datas = newArr;
}else{
console.log($scope.tempdatas);
$scope.datas = $scope.tempdatas;
};
};
/*select触发监听值*/
$scope.searchChange = function(v){
console.log(v);
$scope.selectVague = v[0].name;
};
//获取公司列表
function companyList(){
$http({
method:"post",
url:"url",
params:{
token:"token",
curPage: 0,
pageSize: 50
}
}).success(function(data){
$scope.datas = data.data.list;
$scope.tempdatas = $scope.datas;
})
}
});
</script>
</body>
</html>
