Ng重复和ng类错误

时间：2016-02-25 23:36:45

标签： angularjs

我有一些类别和子类别。当我选择类别时，它会创建子类别。接下来我想选择所选类别的子类别但是类正在改变。我想，当我选择一个类别以便能够选择该类别的子类别时。这是codepen：
http://codepen.io/anon/pen/GZKBaW。
感谢帮助！：）

<html lang="en" ng-app="StarterApp">
<head>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js">
</script>
</head>
<body  ng-controller="AppCtrl">  
    <ul class="main">
    <li  ng-repeat="a in categories" 
      ng-class="{active : toggled==$index,none:toggled!=$index}"
      ng-click="set($index)">{{a.name}}
      <ul>
         <div ng-show="showData">
           <li ng-class="{'active':event==$index,'none':event!=$index}"   ng-repeat="b in subcategories" ng-click="setSubcategory($index,b)">{{b}}</li>
           </ul>
        </li>
      </ul>
</body>
</html>

1 个答案:

答案 0 :(得分：1)

不应直接访问html，

你直接访问html，你不应该在你的情况下。我会将您的控制器更改为

var app = angular.module('StarterApp', []);

app.controller('AppCtrl', ['$scope', function($scope) {

  $scope.categories = [{
    'name': 'work',
    'subcategories': ['saved', 'study', 'plm']
  }, {
    'name': 'move',
    'subcategories': ['saved', 'study', 'xxx']
  }, {
    'name': 'flirt',
    'subcategories': ['saved', 'travel', 'aaa']
  }];

  $scope.setSelectedCategory = function(category){
    $scope.selectedCategory = category;    
  }

  $scope.setSelectedSubcategory = function(subcategory){
    $scope.selectedSubcategory = subcategory;
  }
}]);

和你的html，

  <ul class="main">
    <li ng-repeat="category in categories" ng-click="setSelectedCategory(category)" ng-class="{'active' : category == selectedCategory}">  
      {{category.name}}
      <ul ng-show="category == selectedCategory">
          <li ng-class="{'active':selectedSubcategory == subcategory}" ng-repeat="subcategory in category.subcategories" ng-click="setSelectedSubcategory(subcategory)">{{subcategory}}</li>
      </ul>
    </li>
  </ul>

http://codepen.io/anon/pen/XdrPqm