AngularJS:ui-router:不输出当前状态的链接? [英] AngularJS: ui-router: Do not output link of current state?

问题描述

是否可以检查视图中的状态并且不输出当前(活动)状态的链接?

Is it possible to check state in the view and don't output the link for current (active) state?

目前正在尝试:

<a ng-if="!$state.includes('dashboard.common')" ui-sref="dashboard.common" >Dashboard</a>
<span ng-if="$state.includes('dashboard.common')">Dashboard</span>

当然，我可以用 装饰它ui-sref-active，但我根本不想有链接.

Of course, I could decorate it with ui-sref-active, but I don't want to have link at all.

有什么想法吗?

推荐答案

答案在这里

我的最终版本是:

angular.module('ui')
  .directive('uiLink', function($state) {
    'use strict';

    return {
      restrict: 'E',
      transclude: true,
      template: [
        '<a ui-sref="{{uiSref}}" ng-if="!isCurrent()" ng-transclude></a>',
        '<span ng-if="isCurrent()" ng-transclude></span>'
      ].join(''),
      link: function(scope, element, attrs) {
        scope.uiSref = attrs.sref;
        scope.isCurrent = function() {
          return $state.includes(attrs.sref);
        };
      }
    };
  });

所以现在你可以像这样使用这个指令:

so now you can use this directive like:

<ui-link sref="dashboard.common"><span translate="MY_DASHBOARD">Dashboard</span></ui-link>

这篇关于AngularJS:ui-router:不输出当前状态的链接?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！