Laravel 4 和 AngularJS - 使用路由清理 URL答案

【问题标题】：Laravel 4 and AngularJS - clean URL's with routingLaravel 4 和 AngularJS - 使用路由清理 URL
【发布时间】：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 处理的路由......我该如何解决这个问题？谢谢

【问题讨论】：

标签： javascript php angularjs laravel laravel-4

【解决方案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('admin{angular}', function () {
    return View::make('backend/dashboard');
})->where('angular', '.*');

代替：

Route::group(['prefix' => 'admin'], function()
{
    Route::get('/', function() {
        return View::make('backend/dashboard');
    });
});

这应该会捕获所有以 admin 开头的路由，我相信这是你想要的。

【讨论】：