带有 Angular.js 的 Laravel 4 RESTful API

Laravel 4 RESTful API with Angular.js

提问by devo

I have a RESTful APIbased application with Laravel 4and Angular.js. The application's CRUD processes are handled by angularjs $http service.

我有一个基于 RESTful API的应用程序，带有Laravel 4和Angular.js。应用程序的 CRUD 进程由 angularjs $http 服务处理。

The Backend Side (Laravel 4):

后端（Laravel 4）：

Routing : app/routes.php

路由：app/routes.php

//.....
Route::group(array('prefix' => 'api/v1', 'before' => 'auth.basic'), function()
{
    //....
    Route::resource('pages', 'PagesController');
    //....
});
//.....

Controller : app/controllers/api/PageController.php

控制器：app/controllers/api/PageController.php

<?php

//.....
class PagesController extends BaseController {
  //......
  public function update($id) {
        $page = Page::find($id);

        if ( Request::get('title') )
        {
            $page->title = Request::get('title');
        }

        if ( Request::get('slug') )
        {
            $page->slug = Request::get('slug');
        }

        $page->save();

        return Response::json(array(
            'error' => false,
            'message' => 'Page Updated'),
            200
        );
  }
  //......
}

Calling : cURL

调用：卷曲

This update function can be accessed using cURL method also.

也可以使用 cURL 方法访问此更新功能。

curl -i -X PUT --user admin:admin -d 'title=Updated Title' localhost/laravel/index.php/api/v1/pages/2

Front-end : HTML

前端：HTML

<!-- Top Code -->
<!-- From to Add/Edit Pages -->
<form class="form-horizontal" role="form" ng-show="edit" ng-submit="updatePage(entry)">

  <!-- Page Title -->   
  <div class="form-group">
    <label class="col-lg-2 control-label">Page Title</label>
    <div class="col-lg-4">
      <input type="text" class="form-control" value="{{entry.title}}" ng-model="entry.title">
    </div>
  </div>

  <!-- Slug -->
  <div class="form-group">
    <label class="col-lg-2 control-label">Slug</label>
    <div class="col-lg-4">
      <input type="text" class="form-control" value="{{entry.slug}}" ng-model="entry.slug">
    </div>
  </div>


  <div class="form-group">
    <div class="col-lg-offset-2 col-lg-10">
      <button type="submit" class="btn btn-primary">Update</button>
    </div>
  </div>

</form>
<!-- Bottom Code -->

Client-side : angularjs

客户端：angularjs

// ......
function pageCtrl($scope, $http, Data) {
  //.........
  $scope.updatePage = function(entry) {


        $http({method: 'PUT', url: Data.root_path + 'api/v1/pages/'+id}).
        success(function(data, status, headers, config) {
            //
        }).
        error(function(data, status, headers, config) {
            //
        });

  }
  //.........
}

Question:

题：

1. How can I pass my form data(more than one values) to the $http.put request here ?
2. How can I access the PUT request data in Laravel 4 Controller ? Can I use Input::get() ?

1. 如何将我的表单数据（多个值）传递给 $http.put 请求？
2. 如何在 Laravel 4 Controller 中访问 PUT 请求数据？我可以使用 Input::get() 吗？

采纳答案by Nitish Kumar

Need some update in your html to get page id to update. Add the following html inside form.

需要在您的 html 中进行一些更新以获取要更新的页面 ID。在表单中添加以下 html。

<input type="hidden" ng-model="entry.id" value="entry.id"/>

Then change angular script to,

然后将角脚本更改为，

 $scope.updatePage = function(entry) {

    $http.put(Data.root_path + 'api/v1/pages/' + entry.id, entry)
     .success(function(data, status, headers, config) {
        //
     })
     .error(function(data, status, headers, config) {
        //
     });
 }

And in your Laravel Controller,

在你的 Laravel 控制器中，

public function update($id) {

  $page = Page::find($id);

  $input = $input = Input::all();

   if ( $input['title'] )
   {
      $page->title = $input['title'];
   }

   if ( $input['slug'] )
   {
     $page->slug = $input['slug'];
   }

  $page->save();

  return Response::json(array(
    'error' => false,
    'message' => 'Page Updated'),
    200
  );
}