AngularJS根据url /条件显示div [英] AngularJS show div based on url/condition

问题描述

我在 AngularJS 应用程序中拥有全局菜单。我不想在某些路径上显示某些链接。我已经尝试了以下。在我的控制器中：

  $ scope.location = $ location; 
  

在我看来：

 < div ng-if =location.path（）！= / signup> 
 [内容] 
< / div> 
  

但是我无法让它工作。任何想法？

另外，有没有办法在页面上打印当前路径？

解决方案

你应该看看ng-show和ng-hide。它们可以用来有条件地显示和隐藏页面上的内容。例如：

 < div ng-show =myBoolean>当myBoolean为true时，内容将显示< DIV> 
  

您可以使用调用函数来替换myBoolean，该函数将检查路径或执行无论你需要检查什么。我相信这应该或多或少地做你正在寻找的东西！有关ng-show 请参阅此处的更多文档。

如果文档或我的示例很难阅读，我很快就为你写了一个plunkr（ http：// plnkr .CO /编辑/ 6fUZDzzGsRjowPOJZ6He？p =预览）。基本上这只是展示了如何使用ng-hide / ng-show指令（它们是相同的，只是彼此相反）。我写的关键例程是：

$ p $ code $ $ scope.checkToggle = function（）{
//替换myBoolean 用检查路径
的逻辑返回$ scope.myBoolean;
};

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

I'm having a global menu in a AngularJS app. I don't wan't to show some links on certain paths. I have tried the following. In my controller:

$scope.location = $location;

In my view:

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

But I can't get it to work. Any ideas?

Also, is there a way to print out the current path on the page somehow?

解决方案

You should look at "ng-show" and "ng-hide". They can be used to conditionally show and hide content on a page quite easily. An example would be:

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

You can replace "myBoolean" with a call to a function in scope that will check the path or do whatever it is that you need to check. I believe this should do more or less what you are looking for! For more documentation on ng-show see here.

In case the documentation or my example are difficult to read I wrote up a plunkr for you quickly (http://plnkr.co/edit/6fUZDzzGsRjowPOJZ6He?p=preview). Basically this just shows how to use the ng-hide/ng-show directive (they are the same, just opposites of each other). The key routine that I wrote is:

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

Just replace that logic with what you want to check on the location and it should hide/show correctly. The really nice thing about using this particular directive is you can easily support css animations/transitions which will allow you to nicely fade your element in or out of the page as you hide and show it. Hope this all helps. Best of luck!

这篇关于AngularJS根据url /条件显示div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！