【问题标题】：Get current state of ui-router with ng-if使用 ng-if 获取 ui-router 的当前状态
【发布时间】：2016-08-11 14:42:35
【问题描述】：

我有两个按钮。我想使用 ng-if 确保其中一个按钮仅在您位于应用程序的某个页面时可见。

我希望其他按钮在应用程序中的任何地方都可见，除非您在该特定页面。

所以我认为我可以使用 ng-if。

按钮 1

<md-button ng-if="$state.current.path === example" class="md-icon-  button" aria-label="More" ui-sref="health">
            <md-icon md-svg-icon="images/back.svg"></md-icon>
          </md-button>

按钮 2

        <md-button ng-if="!($state.current.path === example)"class="md-icon-button" aria-label="More" ng-click="toggleHamburger()">
            <md-icon md-svg-icon="images/menu.svg"></md-icon>
        </md-button>

在我的控制器中，我使用的是常规的 ui-router 语法（如下所示）

.state('example', {
        url: "/example",
        templateUrl: "components/examples/example.html"
    })

但这不起作用：如何访问 UI 路由器的当前状态并使用它来评估我的按钮是否应该可见？

【问题讨论】：

您在控制台中收到什么错误消息？
什么和哪里不工作？
无，按钮都是可见的。我认为我根本没有成功获得当前路线。我不确定语法

标签： javascript html angularjs angular-ui-router

【解决方案1】：

您必须在您的范围内公开状态。

控制器：

// ... stuff
$scope.currentPath = $state.current.path
// ... more stuff

查看：

<md-button ng-if="currentPath === 'example'" class="md-icon-  button" aria-label="More" ui-sref="health">
    <md-icon md-svg-icon="images/back.svg"></md-icon>
</md-button>

【讨论】：

如果这是正确的，那么它可能只是 $state.current.path 而不是 ng-if 中的 $state.currentPath
$state 会自动在作用域中暴露自己吗？如果确实如此，则可以确定，但如果不是，则可以将其命名为访问权限，无论何时选择

【解决方案2】：

你可以像这样在这里使用$location.path()。

ng-if="$location.path() === example"

【讨论】：

【解决方案3】：

更简单的是使用 ui-sref-active 指令，添加一个显示元素的类

示例

<ui-sref-active="show-element" class="md-icon-button ng-hide"

然后在你的 css 中：

.show-element {
  display: block/inline-block;
}

【讨论】：

我该怎么做？