如何同时使用laravel和angularjs路由? [英] How to use laravel and angularjs routing together?

问题描述

我正在使用laravel php框架执行代码，并且我希望angularjs为我处理路由.我在这里有一个示例: http://embed.plnkr.co/dd8Nk9PDFotCQu4yrnDg/preview 我如何使用angularjs路由方法在页面之间进行交换，但是它们使用简单的.html文件来呈现内容.这是我在互联网上找到的样本.

I am using laravel php framework for the code execution and I want angularjs to handle the routing for me. I have an example here : http://embed.plnkr.co/dd8Nk9PDFotCQu4yrnDg/preview which shows me how to swap between the pages using angularjs routing methods but they use simple .html files to render the content . It is a sample I found on the internet.

此外，在拉拉韦尔(Laravel)，它有自己的路线.从数据库中获取内容后，如何引导angularjs路由器调用laravel路由并相应地渲染页面?我是Angularjs的新手.谢谢.

Moreover in laravel it has its own routes. How can i guide the angularjs router to call the laravel route and render the page accordingly after fetching the contents from database ? I am new to Angularjs . Thank you.

推荐答案

有两种方法可以实现目标，但是您不再使用Blade.在这里，我只是在解释最简单的方法.
1.在您的routes.php中创建一个index.php(不是index.blade.php)，您需要:

There are a couple of methods achieving the goal, but you do NOT use blade any more. Here I am just explaining the easiest way.
1. create a index.php (not index.blade.php), in your routes.php, you have:

Route::get('/', function()
{
    return View::make('index');
});

它将返回您的索引页面.
在index.php中，请包含

It will return you the index page.
In index.php, please include

    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.3/angular-route.js"></script>

或您的本地依赖项.

1. 在公用文件夹中，您可以创建一个名为"js"的文件夹，另一个名为"templates"的文件夹.
   

1. In the public folder, you can create folder called "js", another folder called "templates".
   

在"js"文件中，创建"app.js"，"controller.js"等(不要忘记将它们包含在index.php中)

In the "js" file, creates your "app.js", "controller.js", and etc. (Don't forget to include them in your index.php)

在模板"文件夹中，您将创建模板html.在您给出的示例中，它们是"home.html"，"about.html"，"contact.html"

In the "templates" folder, you will create your template html. In your given example, they are "home.html", "about.html", "contact.html"

在索引页面中，您可以在此处进行角度布线.
app.js:

In the index page, you do the angular routing here.
app.js:

var app = angular.module('app', [ 'ngRoute' ]);
app.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl : 'templates/home.html',
            controller  : 'mainController'
        })

        .when('/about', {
            templateUrl : 'templates/about.html',
            controller  : 'aboutController'
        })

        .when('/contact', {
            templateUrl : 'templates/contact.html',
            controller  : 'contactController'
        });
});

这篇关于如何同时使用laravel和angularjs路由?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！