index.html 3 KB
<html ng-app="myApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>无标题</title>
    <link href="../directive/style.css" rel="stylesheet">
    <link rel="stylesheet" href="http://xn-static.oss-cn-hangzhou.aliyuncs.com/css/xn-bootstrap/1.0.1/bootstrap.min.css">

    <style>
        body{
            color: #333;
        }
        .xn-text-right{
            text-align: right;
        }
    </style>
</head>
<body ng-controller="MyController">




<div class="clearfix"></div>
<h3>例子</h3>
<div  style=" width: 250px;margin-left:500px">

    <div  zd-select-list   ng-model="seleceData"  data-method="getList(data)"   placeholder="请输入企业名"  data-callback="selectMethod(data)" > </div>

</div>
<div style="height: 50px">

    选择后的值:    {{seleceData}}
</div>



</body>


<script type="text/javascript" src="../spm_modules/jquery/1.7.2/jquery.js"></script>
<script type="text/javascript" src="../spm_modules/xn-angular/1.0.0/angular.js"></script>
<script type="text/javascript" src="../spm_modules/angular-ui/1.2.0/bootstraptpls.js"></script>
<script type="text/javascript" src="../directive/selects.js"></script>
<script type="text/javascript">
        angular.module("myApp", ["zd.directive.select"])
        .controller("MyController", ["$scope","$timeout", function($scope,$timeout){


            $scope.getList=function(method){
                $timeout(function () {
                    var itemList=[
                        {name:"休闲运动男女鞋春夏秋凉鞋", id:1},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:2},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:3},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:4},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:5},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:6},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:7},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:8},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:9},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:11},
                        {name:"休闲运动男休闲鞋休闲运动男女鞋春夏秋凉鞋女鞋春夏秋凉鞋",  id:12},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:13},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:14},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:15},
                        {name:"休闲运动男女鞋春夏秋凉鞋",  id:22}
                    ];

                    /*数据请求完成后返回写法*/
                    method.deferred.resolve({itemList:itemList});
                },1000);
            };

            //选择框
            $scope.selectMethod=function (data) {
                alert("确定");
                console.log(data);
            }
        }]);
</script>
</html>