Example

Question

任何人都可以帮我解决ng-option问题，我正在尝试动态创建ng-option。我正在做的事情非常复杂，但我试着在以下链接中解释它我有两个下降，第一个有县，市和区的价值，根据在第一个下拉框选择的什么，第二个下拉框将有县或市或人口区填充。但问题是，县或区或市的json具有不同的结构，因此第二次下拉的ng-option必须是动态的。请帮忙

<div ng-controller="myCtrl">
    <select id="FeatureTypeDropdown" class="form-control input-sm" ng-model="factory.geography.featuretype" ng-options="ft as ft.type for ft in featuretype" ng-change="SimpleMethod(featuretype.selected)">
        <option value="">Select a Feature Type...</option>
    </select>
    <select id="Select1" class="form-control input-sm" ng-model="factory.geography.county" ng-options="c as c.CountyName for c in County" multiple>
        <option value="">Select a Feature...</option>
    </select>    
</div>

昂

ular.module("myApp",[])
.controller("myCtrl",function($scope){

        $scope.featuretype = [
                    { type: 'County' },
                    { type: 'Municipality'},
                    { type: 'District'}
    ];
    $scope.County = [{ CountyName: 'C1', countyNumber: '01' }, { CountyName: 'C2', countyNumber: '02' }, { CountyName: 'C3', countyNumber: '03' }, { CountyName: 'C4', countyNumber: '04' }];
    $scope.Municipality = [{ MunicipalityName: 'M1', MunicipalityNumber: '01' }, { MunicipalityName: 'M2', MunicipalityNumber: '02' }, { MunicipalityName: 'M3', MunicipalityNumber: '03' }];
    $scope.Districts = [{ DistrictsName: 'D1', DistrictsNumber: '01' }, { DistrictsName: 'D2', DistrictsNumber: '02' }, { DistrictsName: 'D3', DistrictsNumber: '03' }];    
});

访问http://jsfiddle.net/LfEMw/3/

感谢

Answer 1

喜欢这个吗？

Example

HTML

<div ng-controller="myCtrl">
    <select id="FeatureTypeDropdown" class="form-control input-sm" ng-model="option1" ng-options="ft as ft.type for ft in featuretype">
        <option value="">Select a Feature Type...</option>
    </select>
    <select id="Select1" class="form-control input-sm" ng-model="factory.geography.county" ng-options="c as c[option1.displayName] for c in option1.data" multiple>
        <option value="">Select a Feature...</option>
    </select>    
</div>

JS：

angular.module("myApp",[])
.controller("myCtrl",function($scope){
    $scope.County = [{ CountyName: 'C1', countyNumber: '01' }, { CountyName: 'C2', countyNumber: '02' }, { CountyName: 'C3', countyNumber: '03' }, { CountyName: 'C4', countyNumber: '04' }];
    $scope.Municipality = [{ MunicipalityName: 'M1', MunicipalityNumber: '01' }, { MunicipalityName: 'M2', MunicipalityNumber: '02' }, { MunicipalityName: 'M3', MunicipalityNumber: '03' }];

    $scope.Districts = [{ DistrictsName: 'D1', DistrictsNumber: '01' }, { DistrictsName: 'D2', DistrictsNumber: '02' }, { DistrictsName: 'D3', DistrictsNumber: '03' }];

        $scope.featuretype = [
            { type: 'County', data:$scope.County, displayName:'CountyName' },
             { type: 'Municipality', data:$scope.Municipality, displayName:'MunicipalityName'},
             { type: 'District', data:$scope.Districts, displayName:'DistrictsName'}
    ];
});

AngularJS动态ng-option链接两个下拉菜单

1 个答案:

Example