Question

我的网站设置如下。当Button C点击它时，必须更改myClass值。

index.html的类具有：myClass = "container gnc1"

点击Button C时的通缉值：myClass = "container"

<body ui-view="viewA">  //firtsCtrl
    <div ng-class="myClass">
    <div ui-view="viewC">
    <div ui-view="viewB">

        <a ui-sref="B">Button B</a> //Loads the B.html to where viewB is. secondCtrl


        <a ui-sref="C" ng-click="removeClass()">Button C</a> //Loads the C.html where viewC is. thirdCtrl


 </div>

 </div>

这是我的代码：

firstCtrl：

.controller('indexCtrl', function($scope, MY) {
        $scope.myClass = ["container","gnc1"];
        $scope.removeClass = function() {
        $scope.myClass.splice(1, 2);
}
})

但是这没用。当我单击Button C“myClass”值变空时，div中没有类。

Answer 1

执行此操作的更多angular方法是将更改的类与$scope变量绑定，以便您可以从控制器更改它，如果您需要在控制器之间共享数据应该使用service，请参阅此处：How to communicate between directive (tree component) and any other controller or directive in AngularJS app?

<div ng-class="{'gnc1': yourVariable}" class="container">
    <div ui-view="viewC">
    <div ui-view="viewB">
        <a ui-sref="B">Button B</a>
        <a ui-sref="C" ng-click="removeClass()">Button C</a> 
    </div>
</div>

在你的控制器上：

.controller('indexCtrl', function($scope, MY) {
        $scope.yourVariable = true;
        $scope.removeClass = function() {
            $scope.yourVariable = false;
        }
})

具有更改ng-class的Ui-router嵌套视图

1 个答案: