Javascript 使用角度ng单击和ng类更改类

Javascript 使用角度ng单击和ng类更改类,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,我有一系列带有子菜单的菜单项,它们都有一个向下倾斜的图标,应该使用classrotate180向上翻转。问题是,我无法隔离功能,使其只发生在我打开的菜单中,而不是所有菜单中。此外,我需要它停留在所需的位置根据菜单被打开或关闭。单击菜单时打开/关闭该菜单,或打开菜单后取消图标翻转。希望这是有道理的 这是我的html <div class="menu-item"> <md-list id="playerTrigger" ng-click="menuIsOpen = 1; c

我有一系列带有子菜单的菜单项,它们都有一个向下倾斜的图标,应该使用class
rotate180
向上翻转。问题是,我无法隔离功能,使其只发生在我打开的菜单中,而不是所有菜单中。此外,我需要它停留在所需的位置根据菜单被打开或关闭。单击菜单时打开/关闭该菜单,或打开菜单后取消图标翻转。希望这是有道理的

这是我的html

<div class="menu-item">
    <md-list id="playerTrigger" ng-click="menuIsOpen = 1; changeClass()" layout="row" layout-padding="" class="layout-row" layout-align="center center" flex>
        <span class="title flex" flex=""> Players</span>
        <span ng-class="class"></span>
    </md-list>
    <div class="sub-menu" ng-show="menuIsOpen===1" ng-animate="'animate'">
        <md-menu-item ng-repeat="item in vm.players">
            <md-button>
                <div layout="row" flex="">
                    <a ui-sref="{{item.linkto}}" class="">
                        <p flex="">{{item.title}}</p>
                    </a>
                </div>
            </md-button>
        </md-menu-item>
    </div>
</div>

因为您只需要切换
rotate180
class,所以我会在
class
属性中保留静态类,在
ng class
中保留更改类:

<span class="ti-icon ti-mini right ti-angle-down" ng-class="{'rotate180': rotate}"></span>

确实是一种更干净的方法来添加类,但这正是我的代码所做的,只是更干净而已。changeClass()将触发此翻转,并在每个菜单项上调用它。因此,当我点击一个菜单项时,它会对所有菜单项进行操作。我正在寻找一种单独的方法,只对正在单击的菜单项执行此操作,而不为每个项创建函数。您也可以使用
ng init
ng click
在控制器上执行此操作,而不使用任何属性或方法。我认为,这有时会更好,因为它使控制器代码更轻,更简单清洁工
$scope.rotate = false; //initial value 
$scope.changeClass = function() { 
     $scope.rotate = !$scope.rotate;
}