3

我想$locationProvider在 AngularJS 中使用该服务，而不在我的ng-view.

我有一个元素通过绑定到数据元素的存在来div按需显示。ng-show我想通过 将它连接到浏览器位置，$locationProvider但保持在同一个模板中。

模板：

<div> other stuff ... </div>

<div ng-show="model">{{ model.element }}</div>

控制器：

Controller = function($scope, $location) {
  $scope.show = function() {
    $scope.model = model;    // show div
  }

  $scope.hide = function() {
    $scope.model = null;    // hide div
  }
}

我不知道如何在其中集成$location服务。如果history.pushState直接设置，AngularJS 也会覆盖位置。

4

1 回答 1

6

使用源，卢克:-) http://code.angularjs.org/1.0.0/angular-1.0.0.js

如果您查看 ngViewDirective（实际上非​​常简单），它只会捕获 '$routeChangeSuccess' 事件并相应地更改视图。

所以你可以捕获 $routeChangeSuccess 然后将 $route 注入你的控制器，检查新路由是否是你想要的，并相应地显示。（我认为：D）

这可能有效（未经测试）：

//declare a route so angular knows to broadcast about it when it's hit
//We aren't declaring any actions for the route though,
//since below we define custom actions
myApp.config(function($routeProvider) {
  $routeProvider.when('/superman', {});
}); 

function SupermanCtrl($scope, $route) {
  $scope.$on('$routeChangeSuccess', function() {
    //If this doesn't work, console.log $route.current to see how it's formatted
    if ($route.current == '/superman')
      $scope.show = true;
    else
      $scope.show = false;
  });
}

我希望它有效，如果没有，它应该足够开始了。我鼓励您阅读 ngViewDirective，如果这不起作用，请搜索“$routeChangeSuccess”并弄清楚它是如何/为什么被广播的。

于 2012-06-24T18:17:15.713 回答