在Angular中路由到非Angular页面

Question

我正在将大型服务器呈现的应用程序转换为使用Angular。由于尺寸大小，我们一次只做一点。在此转换期间，部分应用会使用Angular，部分则不会。这意味着路由有时会在Angular应用中路由，有时它需要从旧世界转换到新世界（简单）或新世界转换到旧世界（更难）。在理想情况下，我想专门将Angular应用程序（新世界）中的一些页面转换路由到适当的控制器，但是其他任何页面转换都应该只是获取新的HTML页面（旧世界）。

我似乎无法弄清楚如何做到这一点。我想我需要使用routeProvider和when/otherwise，但是我没有找到很多有用的文档。

Answer 1

正如triggerNZ说，你总是可以有一个控制器重定向未处理的路线到外面。这里是HTML和Javascript显示如何做到这一点。

HTML

<div ng-app="myApp"> 
    <script type="text/ng-template" id="this.html"> 
     This Page. 
    </script> 
    <script type="text/ng-template" id="that.html"> 
     That Page. 
    </script> 
    <div> 
     <ul> 
      <li><a href="/this">This</a></li> 
      <li><a href="/that">That</a></li> 
      <li><a href="/other">Other</a></li> 
     </ul> 
     <ng-view></ng-view> 
    </div> 
</div> 

的Javascript

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

app.config(function ($routeProvider, $locationProvider) { 
    $routeProvider.when('/this', { 
     templateUrl: 'this.html' 
    }).when('/that', { 
     templateUrl: 'that.html' 
    }).otherwise({ 
     template: "<div></div>", 
     controller: function ($window, $location, $rootScope) { 
      if (!$rootScope.isInitialLoad) { 
       $window.location.href = $location.absUrl(); 
      } 
     } 
    }); 

    $locationProvider.html5Mode(true); 
}); 

app.run(function ($rootScope) { 
    $rootScope.$on('$routeChangeSuccess', function() { 
     $rootScope.isInitialLoad = (typeof $rootScope.isInitialLoad === "undefined"); 
    }); 
}); 

Answer 2

您不能在旧世界使用routeProvider，因为角度路线只能引导您在实际的同一页面内。

你可以做一个占位符角路线每个遗留的路线，然后在控制器中，注入$window和做类似：

$window.location.href = destinationUrl; 

喜欢的东西：（去旧世界上注销）

app.controller('LogoutCtrl', function ($scope, $window) { 
    var destinationUrl = 'https://mywebsite.com/'; 
    $window.location.href = destinationUrl; 

}); 

反之亦然，回到角度的世界，只是使用普通的链接到你的角度路线：

<a href="angular-app/#/my/route">Link</a> 

如果你想有一个包罗万象的路由重定向到外面，你可以做到以下几点：

otherwise({ 
    controller: 'NotFoundCtrl' 
    }); 
... 
app.controller('NotFoundCtrl', function($scope, $location, $window) { 
    var path = $location.path(); 
    $window.location.href="http://test.com" + path; 
})