簡單的工作流程與angularJs和laravel 4

Question

我開始說，我真的與angularJs新，我覺得它真的很有用的web應用程序的大環境。

經過一些研究和文檔後，我得到了一些問題，首先它讓我困惑於如何實現它到服務器端語言（在我的情況下，基於laravel 4.1的PHP），因爲angularJs有路由和模板等。 ..所以這是一個合適的框架，甚至可以獨立工作。

讓我們更好地挖掘我想要到達的位置，以瞭解這個2框架的工作流程。

---

1檔問題

我的一些資源，如何看到了angularJs是很容易顯示出來的JSON的結果，並與DOM結合。我甚至看到有些開發人員在dom的第一個負載上使用angularJs打印出結果，而不是在laravel控制器上使用單個函數，並使用laravel處理結果。

我認爲這在兼容性方面並不合適，因爲angular正在工作IE 8以及之後，如果我禁用javascript，我也不會看到結果。相反，如果我使用laravel 4，第一次處理結果如何，我會一直看到它！這是我看到的一個例子。

路線Laravel

// set 2 types of route, the first for get the json results for do handle to Angular 
// the second route for display the view 
Route::get('users','UserController@getUsers'); 
Route::get('/','UserController@getIndex); 

UserController中Laravel

public function getUsers() { 

$users = User::all(); 
return $users; // return all users in json 

} 

public function getIndex() { 

    return View:make('index'); 

} 

AngularJs

module.controller('UserCtrl', function($scope,$http) { 

    users: function() { 
     return $http.get('/users').then(function(result){ 
        return result.data; 
       }); 
    }; 

}); 

關於查看

<div ng-repeat="users in user">{{ user }} </div> 

嘿！如果我的頁面有20個查詢結果，我不想做20條路線和角度函數。 我說的沒錯？但如果他們這樣做應該是一些原因。

---

2日 - 問

我如何說我使用angularjs與laravel 4.1有，我將用angularJs的路線的可能性之前？在我看來是沒有。因爲我處理與laravel 4.

---

3日我的路線 - Quenstion

最好的方法調用ajax後纔會顯示結果並將其綁定到我的模板。也許這個問題可以完全違揹我的第一個問題，因爲如果我用這個邏輯設置我的應用程序，我已經準備好爲將來的調用ajax，而不重寫我的結果的部分模板。

假設我想分頁顯示以前的結果，因此我會去撥打ajax來顯示下一個或上一個結果。如果我遵循我所看到的邏輯（第一個例子），我唯一要做的就是在前一個對象json上推送新結果。

而是如果我使用laravel我的結果如何第一處理程序（正常返回視圖和foreach），在調用ajax後，我必須創建單個模板以顯示具有相同樣式和追加結果的結果。你如何顯示結果，哪個是最好的方法？

---

Answer 1

所有AngularJs的第一手柄前端路由本身。您的laravel服務只能用於RESTful API（如carlosdubusm提到的）。

如果你不想做20部電話，你總是可以的角度服務，將處理一個調用來獲取你需要的所有數據，分析它，並提供給控制器，指示等

角是異步工作，所以如果您用承諾包裝代碼，它將自行處理數據更改。

我希望這是你想知道的。

//編輯：

承諾例如

$scope.user = { 
     name : '', 
     email : '' 
    }; 

$scope.updateUserInfo = function (response) { 
     $scope.user = response; 
    }; 

// users model have rest calls to api using restangular 
usersModel.getMyInfo() 
.then($scope.updateUserInfo); 

服務樣本

'use strict'; 
app.factory('alertService', function ($timeout){ 
    return new AlertService($timeout); 
}); 

var AlertService = function($timeout) { 
    this.queue = []; 
    this.alerts = []; 

    var AlertService = this; 

    this.TYPE_INFO = 0; 
    this.TYPE_SUCCESS = 1; 
    this.TYPE_ALERT = 2; 
    this.TYPE_ERROR = 3; 

    this.add = function (msg, type) { 
     var alert = new AlertItem(msg, type); 
     AlertService.queue.push(alert); 
     AlertService.alerts.push(alert); 

     $timeout(function(){ 
      AlertService.closeAlert(alert); 
     }, 10000); 
    }; 

    this.closeAlert = function (alert) { 
     return AlertService.queue.splice(AlertService.queue.indexOf(alert),1); 
    }; 

    this.getAlerts = function(){ 
     return AlertService.queue; 
    }; 

    this.getAll = function() { 
     return this.alerts; 
    }; 

}; 

var AlertItem = function(msg, type) { 

    var TYPE_CLASS = { 
     0: "alert-info", 
     1: "alert-success", 
     2: "", 
     3: "alert-error" 
    }; 

    var type = type; 
    var msg = msg; 

    this.getType = function() { 
     return type; 
    }; 

    this.getClass = function() { 
     return TYPE_CLASS[type]; 
    }; 

    this.getMsg = function() { 
     return msg; 
    }; 

};