有关angularjs的select说明

2015-04-24 21:41:00
hainuo
原创 3067
摘要:级联菜单多级选择cascade
关于ngselect的使用说明ng select默认使用的是json对象默认的序列,但是当序列不匹配时就出出问题如 下文件中的数据(PHPer请使用unserialize,来反序列化为数组后使用)SubjectTreeData.txt这个从后台传递到前台 PHPer请使用json_encode方法来将这个东西生成json对象 传递到前端前端循环对象时不能够使用```<select class="form-control" ng-model="vm.lei"        ng-options="lei.name for  lei in vm.leis">必须使用一下方式方可<select class="form-control" ng-model="vm.lei"        ng-options="lei.name for (loation, lei) in vm.leis track by lei.location">```其实  主要就是为了生成这样子的对象<option value="这里是locaiton的值" label="这里是name的值">这里是name的值`</option>`生成的列表样式如下原因在于如图![blob.png](/ueditor/php/upload/image/20150424/1429883014444647.png)在json对象中我给每一个子对象定义了一个键名,导致angularjs在寻址__KEY__的时候不能够排列上,从而不会在选项卡中列出另外后面的那个track by lei.location也要写清楚,告诉ng是按照什么来填入option的value值具体还是请大家欣赏英文的说明这里给出我的脚本写的方式  这里没有使用directive 主要原因是自己还不太会写directive主要参考对象http://www.ngnice.com/showcase/#/select/cascade 对其控制器部分做了修改```.controller('AppController', function ($scope, $http) {    var vm = $scope.vm = {};    $http.post(Api('subjectListData')).success(            function (data) {                if (data.code == '1001') {                    //console.log(data.data);                    vm.leis = data.data;                    vm.lei = {location: 0, name: '请选择类'};                    // 更换国家的时候清空省                    $scope.$watch('vm.lei', function (lei) {                    //判断后端传递过来的值存在 直接更改对应的下拉列表的值 注意必须要使用他的上级对象的索引,而不是另赋值对象过来                        if ('{$kuan}' != null || '{$kuan}' != 'undefined')                            vm.kuan = lei.children[{$kuan}];                        else                            vm.kuan = null;                        if (lei.code != 'undefined' || lei.code !== null)                            vm.code = lei.code;                        else                            vm.code = null;                    });                    // 更换省的时候清空城市                    $scope.$watch('vm.kuan', function (kuan) {                        if ('{$xiang}' != null || '{$xiang}' != 'undefined')                            vm.xiang = kuan.children[{$xiang}];                        else                            vm.xiang = null;                        console.log({$xiang}, vm.xiang);                        if (kuan.code != 'undefined' || kuan.code !== null)                            vm.code = kuan.code;                        else                            vm.code = lei.code;                    });                    $scope.$watch('vm.xiang', function (xiang) {                        if ('{$mu}' != null || '{$mu}' != 'undefined')                            vm.mu = xiang.children[{$mu}];                        else                            vm.mu = null;                        if (xiang.code != 'undefined' || xiang.code !== null)                            vm.code = xiang.code;                        else                            vm.code = kuan.code;                    });                    $scope.$watch('vm.mu', function (mu) {                        if (mu.code != 'undefined' || mu.code !== null)                            vm.code = mu.code;                        else                            vm.code = xiang.code;                    });                    //处理默认值                    vm.lei = vm.leis[{$lei}];                } else                    show_message($scope, 1, data.info);            }    );    //处理默认值});```
发表评论
伍 乘 贰 =
评论通过审核后显示。