绑定嵌套的select元素在angularjs中不起作用

时间:2014-12-01 06:12:41

标签: javascript angularjs select data-binding nested

我有两个选择下拉列表,第一个是第二个下拉列表的父级。我能够成功地将父选择绑定回“选定项目”。但是我无法将使用ng-model的子选项绑定到选定的父级。我无法让我的榜样工作,因为我是棱角分明的新人,但希望你能得到这张照片。

    $scope.model = {};
    $scope.model = {
      categories: [{
        id: 1,
        name: 'Ford',
        subCategory: ['focus', 'ranger', 'F150'],
        filterValue: ''
      }, {
        id: 2,
        name: 'Honda',
        subCategory: ['accord', 'civic', 'pilot'],
        filterValue: ''
      }],
      selectedCategory: {}
    }


    $scope.categoryChange = function() {
      console.dir($scope.selectedCategory);
    }

    $scope.subCategoryChange = function() {
      console.dir($scope.selectedCategory.subCategory);
    }


    var init = function() {
      $scope.model.selectedCategory = $scope.model.categories[0];
    }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>


    <select ng-model="model.selectedCategory" ng-options="category as category.name for category in model.categories" data-ng-change="categoryChange()"></select>

    <select ng-model="model.selectedCategory.filterValue" data-ng-options="subCategory for subCategory in model.selectedCategory.subCategory" data-ng-change="subCategoryChange()"></select>

1 个答案:

答案 0 :(得分:1)

对我而言,它正在发挥作用! 也许你忘记了ng-app&amp; ng-controller

见这 - &gt; Sample