3

我想在视图上方显示视图名称
基本上，我正在寻找类似的东西

<h1>{{viewName}}<h1>
<div ng-view=""></div>

我尝试了复杂的方法来从 $routeProvider 获取视图名称，但没有取得多大成功。
我的路由器看起来像这样

(function() {

  var app = angular.module("myModule", ["ngRoute"]);

  app.config(function($routeProvider) {
    $routeProvider
      .when("/view1", {
        name: "View One",
        templateUrl: "view1.html",
        controller: "View1Controller"
      })
      .when("/view2", {
        name: "View Two",
        templateUrl: "view2.html",
        controller: "View2Controller"
      })
      .otherwise({
        redirectTo: "/view1"
      });
  });

}());

我在视图之外显示视图名称的原因是容器（在这种情况下）不会在每次视图更改时从 DOM 中删除，否则它会闪烁。

我是否使用了正确的方法？您如何到达 $routeProvider 中的“名称”属性？

4

1 回答 1

5

你可以做这样的事情 - 通过附加到$routeChangeStart事件并将当前路由名称放在 $rootScope 上。

angular.module('myModule', ['ngRoute']).run([
    '$rootScope',
    function ($rootScope) {
        $rootScope.$on('$routeChangeStart', function (event, next) {
            $rootScope.currentRoute = next;
        });
    }]);

然后在您的 HTML 中，您可以这样做：

<span>{{currentRoute.name}}</span>
于 2014-07-05T06:48:47.327 回答