javascript - AngularJS 显示基于 url/条件的 div

标签 javascript html css angularjs

我在 AngularJS 应用程序中有一个全局菜单。我不想在某些路径上显示某些链接。我尝试了以下内容。在我的 Controller 中:

$scope.location = $location;

在我看来:

<div ng-if="location.path() != /signup">
  [Content] 
</div>

但我无法让它工作。有什么想法吗?

还有,有没有办法打印出页面上的当前路径?

最佳答案

你应该看看“ng-show”和“ng-hide”。它们可用于非常容易地有条件地显示和隐藏页面上的内容。一个例子是:

<div ng-show="myBoolean">Content will show when myBoolean is true</div>

您可以将“myBoolean”替换为对范围内函数的调用,该函数将检查路径或执行您需要检查的任何内容。我相信这或多或少应该可以满足您的需求!有关 ng-show see here 的更多文档.

如果文档或我的示例难以阅读,我会快速为您编写一个 plunkr (http://plnkr.co/edit/6fUZDzzGsRjowPOJZ6He?p=preview)。基本上这只是展示了如何使用 ng-hide/ng-show 指令(它们是相同的,只是彼此相反)。我写的关键例程是:

 $scope.checkToggle = function(){
   // replace "myBoolean" with the logic that checks the path
   return $scope.myBoolean;
 };

只需将该逻辑替换为您要在位置上检查的内容,它就会正确隐藏/显示。使用此特定指令的真正好处是您可以轻松支持 css 动画/转换,这将允许您在隐藏和显示元素时很好地将元素淡入或淡出页面。希望这一切都有帮助。祝你好运!

关于javascript - AngularJS 显示基于 url/条件的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21114854/

相关文章:

JavaScript RegExp - 如何根据条件匹配单词

javascript - 如何使用 div 制作 40x40 的网格?

javascript - 如何检查并提醒是否有重复项插入到我的表中?

html - 如何在不拆分每个链接的情况下将水平导航菜单居中

javascript - Jquery - 多次点击导致问题

javascript - bxslider 将 .next 按钮绑定(bind)到轮播中的下一张幻灯片

javascript - 我怎样才能在 AngularJS Controller 中同时获得输入字段的前后值?

javascript - 使用javascript获取复选框列表的SelectedIndexChanged事件

javascript - politico.com 如何在复制的文本中插入超链接?

jquery - 如何使用 JQuery 选择属于隐藏表单字段值数组一部分的隐藏表单字段值?