Question

我做了一个简单的指令。我在该指令上有两个按钮。我能够获得该按钮的点击事件。但我想在其上添加类。

我有一个班级

.red {
  background-color: red;
}

我想在按钮单击时添加此类..

最初登录按钮有红色类。点击退出按钮后，它将应用于注销按钮并从登录按钮

或者，如果我点击登录按钮，它将应用于登录按钮并从注销按钮中删除..

我喜欢那个

angular.module('app', ['ui.router']).directive('tm', function() {
  return {
    restrict: 'E',
    templateUrl: 'login.html',
    scope: {
      login: "&",
      logout: '&'
    },
    controller: 'f',
    controllerAs: 'vm'
  };
})

这是代码 http://plnkr.co/edit/Q1e8u0okOa4looLcb2YO?p=preview

Answer 1

添加链接功能

试试这个

link: function(scope, elm, attr) {
  elm.find("button").on("click", function(e) {
    elm.find("button").removeClass("red");
    angular.element(this).addClass("red");
  })
}

的 PLNKR

或者您可以使用 ngClass
来完成
喜欢这个

<强> JS

vm.isLogin = true; vm.login = function() { vm.isLogin = true; } vm.logout = function() { vm.isLogin = false; }

<强> HTML

<button type="button" class="btn btn-default" ng-class="{'red': vm.isLogin }" ng-click='vm.login()'>Login</button> <button type="button" class="btn btn-default" ng-class="{'red': !vm.isLogin }" ng-click='vm.logout()'>logount</button>

的 PLNKR

如何在角度按钮上添加类？

1 个答案: