添加在AngularJS使用纳克级多前pressions [英] Adding multiple expressions using ng-class in AngularJS

问题描述

我想设置类。主动时，路径是的http：//本地主机/＃/ 或的http：//本地主机/＃/主/ 为两条路径在同一页

I am trying to set the class .active when the path is http://localhost/#/ or http://localhost/#/main/ as both paths are the same page.

为什么纳克级={'class1的'：前pression1，1级：前pression2}？不行

控制器

angular.module('testApp')
  .controller('NavmenuCtrl', function ($scope, $location) {
  $scope.isActive = function (providedPath) {
    return providedPath === $location.path();
  };
});

局部模板视图

<li ng-class="{ active: isActive('/'), active: isActive('/main/')}">
  <a href="#/">Home</a>
</li>

相关链接

使用纳克级添加多个类

AngularJS纳克级的多个条件

奥利弗Tupman：保持CSS类你的角控制器

Scotch.io：使用纳克级的多种方式

推荐答案

让我评论的回答，是你的问题出在重复键，你可以只是做： -

Making my comment an answer, Yes your issue is with the duplicate keys, you could just do:-

ng-class="{ active: isActive('/') || isActive('/main/')}"

或者可能更好： -

Or probably better:-

让你的 isActive 类接受多个参数： -

Let your isActive class accept multiple arguments:-

$scope.isActive = function () {
    //Look for a match in the arguments array
    return [].indexOf.call(arguments, location.path()) > -1;
};

和使用它作为： -

and use it as:-

ng-class="{ active: isActive('/', '/main/')}"

<一个href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf\"相对=nofollow>为的indexOf 沉支持旧的浏览器

Shim support for indexOf for older browsers

这篇关于添加在AngularJS使用纳克级多前pressions的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！