我有一个如下所示的网站设置。单击按钮 C
时,它必须更改 myClass
值。
index.html 具有的类:myClass = "container gnc1"
单击按钮 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>
这是我的代码:
第一个Ctrl:
.controller('indexCtrl', function($scope, MY) {
$scope.myClass = ["container","gnc1"];
$scope.removeClass = function() {
$scope.myClass.splice(1, 2);
}
})
但这没有用。当我单击 Button C
时,“myClass”值变为空,并且 div 中没有类。
最佳答案
一种更 Angular 方法是用 $scope
变量绑定(bind)你正在改变的类,这样你就可以从你的 Controller 中改变它,如果你需要的话要在 Controller 之间共享数据,您应该使用服务
,请在此处查看如何执行此操作: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 上:
.controller('indexCtrl', function($scope, MY) {
$scope.yourVariable = true;
$scope.removeClass = function() {
$scope.yourVariable = false;
}
})
关于javascript - 具有更改 ng-class 的 Ui-router 嵌套 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33178976/