Question

我收到以下错误：

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["isActive('/production'); newVal: [\"/production\"]; oldVal: [\"/production\"]"],["isActive('/production'); newVal: [\"/production\"]; oldVal: [\"/production\"]"],["isActive('/production'); newVal: [\"/production\"]; oldVal: [\"/production\"]"],["isActive('/production'); newVal: [\"/production\"]; oldVal: [\"/production\"]"],["isActive('/production'); newVal: [\"/production\"]; oldVal: [\"/production\"]"]]

当我使用此指令时：

function mainMenu ($location) {
  return {
    restrict: 'E',
    templateUrl: '/app/views/directives/mainMenu',
    link: function ($scope, $element, $attrs) {
      $scope.isActive = function (viewLocation) {
        return $location.path().match(viewLocation)
      }
    }
  }
}

HTML（Jade）

ul.nav.nav-pills(role="tablist")
    li(ng-class="{active: isActive('/production')}")
        a(ui-sref="production") Produktion
    li(ng-class="{active: isActive('/market')}")
        a(ui-sref="market") Markt

ul.nav.nav-tabs(role="tablist" ng-if="isActive('/production')")
    li(ng-class="{active: isActive('/production/board')}")
        a(ui-sref="production.board") Plantafel
    li(ng-class="{active: isActive('/production/warehouse')}")
        a(ui-sref="production.warehouse") Lager

任何想法为什么？我使用带有嵌套视图的ui-router，这就是使用match（）表达式的原因！

谢谢！

修改

ul.nav.nav-pills(role="tablist")
    li(ng-class="{active:$state.includes('production')}")
        a(ui-sref="production") Produktion

这对我不起作用:(我需要它，因为我会在生产中使用活动类，例如嵌套视图production.board处于活动状态。

Answer 1

对于angular ui-router，您可以使用$state.includes

function mainMenu ($state) {
  return {
    restrict: 'E',
    templateUrl: '/app/views/directives/mainMenu',
    link: function ($scope, $element, $attrs) {
      $scope.isActive = function (viewLocation) {
        return $state.includes(viewLocation);
      }
    }
  }
}

还有标准指令ui-sref-active，并查看$state

编辑1：

您应该传递州名（production.board）而不是州网址（/production/board）

编辑2：

您无法从视图中访问$state，因为它来自$scope，在控制器中定义$scope.$state = $state。

但这不是正确的方法，它会使你的代码变脏。

使用功能更好：

在视图中：ng-class="isActive('production.board')"

在控制器中：return $state.includes(viewLocation) ? 'active' : '';

location.path（）的迭代错误

1 个答案: