Question

设置

 app.controller('headerController', ['$scope', '$routeParams', function($scope, $routeParams) {
     $scope.data = $routeParams;
 }]);

 app.config(['$routeProvider',
     function ($routeProvider) {
         $routeProvider.
             when('/:url', {
                 template: '<h2>Hello World</h2>'
             })
 }]);

布局

<body>
    <div ng-controller="headerController">
      Current Url:{{data.url}}
    </div>

    <div ng-view></div>

    <ul>
       <li>
          <a href="#/pageA">Page A</a>
       </li>
       <li>
         <a href="#/pageB>Page B</a>
     </li>
</body>

问题

我希望每次路由更改时，标题部分都会使用当前网址不断更新。当我第一次加载我的应用程序时，这是有效的。但是，如果我更改路由，则控制器不会更新到新URL。

我的问题不在于解决这个问题，因为我知道还有其他方法可以解决这个问题，而是使用此设置解决问题。换句话说，我需要知道如何使用当前路径在视图外部提供控制器，并在每次更改路径时更新控制器。

Answer 1

您应该尝试使$ scope.data成为重新评估的函数。

否则我建议您收听onRouteChangeSuccess以观看URL更改。

Answer 2

我尝试了你的代码并进行了一些细微的改动，例如下面的代码，它完全适用于我的firefox。该网址在更改

时正确更新为Page A或Page B.

我也可能没有理解这个问题？

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

app.controller('headerController', ['$scope', '$routeParams', function($scope, $routeParams) {
     $scope.data = $routeParams;
 }]);

 app.config(['$routeProvider',
     function ($routeProvider) {
         $routeProvider.
         when('/:url', {
             template: '<h2>Hello World</h2>'
         })
 }]);



<html ng-app="app">
<head> 
    <script src="angular.min.js"></script>
    <script src="angular-route.js"></script>
    <script src="controller.js"></script>
</head>
<body>
    <div ng-controller="headerController">
      Current Url:{{data.url}}
    </div>

    <div ng-view></div>

    <ul>
       <li>
          <a href="#/pageA">Page A</a>
       </li>
       <li>
          <a href="#/pageB">Page B</a>
       </li>
</body>

干杯

尼古拉斯

AngularJS - 更改路由更改控制器

2 个答案: