在路由更改时在 ng-view 之外编辑 HTML

Question

我想在路由更改时使用路由信息更改导航栏中的一些 HTML。我几乎可以让它与下面的代码一起工作，但数据在到达 DOM 时不会被解析为 HTML。我尝试使用$sce 服务，但这并没有真正让我有所收获。

如果有任何其他（更好的）方法可以在路由更改时编辑 HTML，请告诉我。

HTML：

<nav>
  <div ng-controller="BrandCtrl">
    <div class="nav-brand">
      {{brand}}
    </div>
  </div>
</nav>

<div ng-view></div>

JS：

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

app.controller("BrandCtrl", function($scope, $route) {
  $scope.$on('$routeChangeSuccess', function() { 
    var html = $route.current.html;
    $scope.brand = html;
  });
});

app.config(function ($routeProvider) {
  $routeProvider
  .when('/next-page', {
    templateUrl: 'partials/next-page.html',
    controller: 'BrandCtrl',
    html: '<h3>New brand</h3>'
});

Answer 1

您应该通过路由中的“视图”更改 HTML。

 $stateProvider.state('app',{url: 'someurl',   
    views: {
      'topnav': { templateUrl: 'path/to/some/html',
            controller: 'navcontroller'},
      'mainContent': {templateUrl: 'path/to/some/other/html',
            controller: 'contentcontroller'}    } 
 });

在您的 HTML 中，您将有多个视图：

 <div ui-view="topnav"></div>   
 <div ui-view="mainContent"></div>