廚老伯開槍中

AngularJS option 範例

先來一個 model

function myModel ($scope) {
    $scope.$countys = [
    {county: '台北',
    districts: ['中正區','中山區']}
    ,{county: '台中',
    districts: [
        {dName:'東區'}
      ,{dName: '北區'}]}];
// countyField 和 districtField用到的 model 應該可以不用宣告,會自動產生
// 這邊宣告則是為了給予初始值,這部份工作也可使用 ng-init 完成
$scope.county = $scope.countys[0];
$scope.district = $scope.countys[0].districts[0];  
//縣市變更後,AngularJS 會自動更新 ng-model(county), 鄉鎮也會自動更新成( c in county.districts)
//資料方面不用擔心。但是由於不會自動設定預設選項,所以這邊要設定預設項目
$scope.countyChange = function (){ 
$scope.district = $scope.county.diss[0];}
}

這邊是對應的 HTML

<!--縣市-->
<select name="countyField" ng-model="county" ng-options="c.county for c in countys" ng-change="countyChange()">
</select>
<!-- 區域 -->
<select name="districtField" ng-model="district" ng-options="c.dName for c in county.districts">
</select>

comments powered by Disqus