Laravel 4 和 AngularJS - 使用路由清理 URL
Posted
技术标签:
【中文标题】Laravel 4 和 AngularJS - 使用路由清理 URL【英文标题】：Laravel 4 and AngularJS - clean URL's with routing 【发布时间】：2014-07-28 23:12:06 【问题描述】：我是 AngularJS 的新手，很难让它与 Laravel 一起顺利工作。我正在尝试为网站创建一个后端应用程序，并希望所有以“/admin”为前缀的路由都由 AngularJS 管理，而 URL 中没有哈希。
Laravel 的后端
路线
Route::group(['prefix' => 'admin'], function()
Route::get('/', function()
return View::make('backend/dashboard');
);
);
查看 - dashboard.blade.php
<!doctype html>
<html ng-app="glenn">
<head>
<title>Laravel and Angular Together</title>
<meta charset="utf-8">
<base href="/admin">
<script src="vendor/angular.js"></script>
<script src="vendor/angular-route.js"></script>
<script src="js/app.js"></script>
</head>
<body>
<h1>Dashboard</h1>
<div class="container">
<ng-view></ng-view>
</div>
</body>
</html>
AngularJS 前端
app.js
var glenn = angular.module('glenn', ['ngRoute']);
glenn.config(function($routeProvider, $locationProvider)
$routeProvider
.when('/test',
templateUrl: 'test.html',
controller: 'TestController'
)
.otherwise(
redirectTo: '/'
);
$locationProvider.html5Mode(true);
);
glenn.controller('TestController', function($scope)
);
问题：当我将浏览器 url 指向 admin/test 时，我会收到 Laravel 的 NotFoundHttpException，因为 Laravel 正试图接管我希望 Angular 处理的路由......我该如何解决这个问题？谢谢
【问题讨论】：
【参考方案1】：相关说明：
如果您正在创建一个 Angular + Laravel Web 应用程序，您希望 all 路由由 AngularJS 处理，您可以在 Laravel 中指定一个“catch-all”路由以避免NotFoundHttpException 错误：
App::missing(function($exception)
return View::make('backend/dashboard'); // this should match your index route
);
【讨论】：
【参考方案2】：由于 Angular 将为管理员处理所有路由（并且您不会在 Laravel 中指定任何进一步的路由），因此您可能可以不使用前缀。
试试：
Route::get('adminangular', function ()
return View::make('backend/dashboard');
)->where('angular', '.*');
代替：
Route::group(['prefix' => 'admin'], function()
Route::get('/', function()
return View::make('backend/dashboard');
);
);
这应该会捕获所有以 admin 开头的路由，我相信这是你想要的。
【讨论】：
以上是关于Laravel 4 和 AngularJS - 使用路由清理 URL的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 AngularJS 保护 Laravel 4 中的 API 访问