0

恐怕我是 Angular 的新手，因此我的知识有限。我希望有一个简单的解决方案，我非常感谢任何帮助。

问题：我有多个下拉列表都填充了来自 $scope.list 的数据，当单击其中一个列表时，它会更新变量 $scope.current。我希望在其他地方的容器类中使用 $scope.current 数组数据。

代码：

// 角度

Set the current item
$scope.current = {
    'activeClass1': 'initial-class1',
    'activeClass2': 'initial-class2'
};

Populate the lists
$scope.itemsList1 = [
    {'name': 'foo1'},
    {'name': 'foo2'},
    {'name': 'foo3'}
];

$scope.itemsList2 = [
    {'name': 'bar1'},
    {'name': 'bar2'},
    {'name': 'bar3'}
];

HTML 列表 1

<ul class="dropdown-menu" role="menu">
   <li ng-repeat="item in itemList1">
     <a href="#" ng-click="current.activeClass1=item.name;>{{item.name}}</a>
   </li>
</ul>

HTML 列表 2

<ul class="dropdown-menu" role="menu">
   <li ng-repeat="item in itemList2">
     <a href="#" ng-click="current.activeClass2=item.name;>{{item.name}}</a>
   </li>
</ul>

// 点击以上列表时要更新的 HTML

<div class="container" ng-class="{{current.activeClass1}} {{current.activeClass2}}">
    Note: two classes need to be added to the parent and kept updated 
</div>

// 输出仅存在初始的“容器”类。

// 更新感谢给出的答案，jsFiddle 表明它应该可以工作，但我的问题是这ng-view导致了我的问题$scope- 一旦将这些动态类和 ng-view 分开，一切正常。再次感谢！

4

2 回答 2

1

您的代码中有两个额外的右花括号。这有效：http: //jsfiddle.net/s7AK7/

$scope.current = {
    'activeClass1': 'initialClass',
    'activeClass2': 'initialClass'
};

$scope.itemsList1 = [
    {'name': 'item1'},
    {'name': 'item2'},
    {'name': 'item3'}
];

$scope.itemsList2 = [
    {'name': 'item1'},
    {'name': 'item2'},
    {'name': 'item3'}
];
于 2014-03-14T19:29:33.147 回答
1

尝试做：

ng-class="[current.activeClass1, current.activeClass2]"
于 2014-03-14T19:22:07.440 回答