0

我对角度很陌生。我想要的是在单击按钮时替换 div 的类。使用“ng-class”会更改页面上所有具有该类的 div 的类，我只想选择一个来替换。

这个jsfiddle演示了我正在尝试做的事情。我正在尝试使用 jQuery，但正如您所见，它在这种情况下不起作用。我的猜测是有一种更“棱角分明”的方式来做到这一点。有什么建议么？

这是jsfiddle中的代码：

<div ng-controller="MyCtrl">
<div class="test1">
    Text1
</div>
<div class="test1">
    Text2
</div>
<button ng-click="click($event)">Click</button>
</div>

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

function MyCtrl($scope) {

   $scope.click = function (e) {
       var source = e.target || e.srcElement;
       var div = source.prev("div.test1:first");
       div.toggleClass('test1');
   };
}

.test1 {
  color: blue;
}
4

1 回答 1

3

是的，您正在尝试以非 AngularJS 的方式来处理它。使用 AngularJS，您需要专注于模型操作，装饰性地描述 UI，让 AngularJS 解决剩下的问题。

解决问题的一种方法是沿着这些思路：

function MyCtrl($scope) {

    $scope.selected = true;

    $scope.click = function () {
      $scope.selected = false;  
    }; 
}

在 HTML 中：

<div ng-controller="MyCtrl">
    <div ng-class="{test1: selected}">
        Text1
    </div>
    <div class="test1">
        Text2
    </div>
    <button ng-click="click()">Click</button>
</div>

在这里工作 jsFiddle：http: //jsfiddle.net/CqHDn/但这实际上只是一种做事方式。这里的关键问题是：第一个 div（从功能上讲）有什么特别之处，以至于您想要翻转它的类？您可能应该在模型中表示功能概念。

就 jQuery 而言：我真的建议在学习 AngularJS 时完全放弃它。我不是唯一一个：https ://stackoverflow.com/a/15012542/1418796

于 2013-03-05T15:38:11.920 回答