angularjs - 如何在 Angular ng-view 中隐藏 index.html 页面的某些内容？

Question

我想知道当我在 angularjs 中访问 View 时是否可以隐藏 index.html 文件中的某些部分。

我的 index.html 文件在所有 View 上都包含一个底部菜单栏，我创建了一个 home.html View ，我不想在其中包含该菜单栏。这可能有 Angular 吗？

谢谢!

Answer 1

少了 $rootScope

$rootScope 的问题在于您将向您的代码添加依赖项。 maddygoround 的回答很好，但是您的 index.html、home.html 和 Controller 都将是硬连接的，因此更改起来会有点困难。

为了摆脱 $rootScope，我将进行以下更改:

<div ng-hide="hideit">This is bottom bar<div>

这与 maddygoround 发布的代码相同，并且它做了它应该做的事情。现在，您无需访问 home.html Controller 并更改 hideit，而是添加一个监听器来更改路由。

可以将下面的代码添加到与 angular.module() 声明相同的文件中；

app.run(function($rootScope, $location){
  $rootScope.$on('$routeChangeStart', function(event, next, current){
    if ($location.path() == '/home') {
      $rootScope.hideit = true;
    };
  });
});

这将使您的 index.html 独立于 home.html Controller 中发生的事情。这是更多的代码，但可以在将来挽救您的生命。我正在尝试摆脱 $rootScope，如果可以的话，我会在没有 $rootScope 的情况下更新我的答案。