AngularJS最佳实践REST / CRUD

Question

通过REST使用AngularJS执行CRUD操作的最佳实践是什么？

特别是这里的角向是什么？我的意思是使用最少的代码和最默认的角度设置来实现这一点。

我知道$resource，这是默认操作。我不确定如何实现/命名端点，以及使用哪些控制器。

对于这个例子，我想实现一个简单的用户管理系统，它创建/更新/deletes / lists用户。因为我是自己实现服务器端点的，所以我完全可以自由地以最友好的角度来实现它。

我喜欢的答案是：

Server-Endpoints:

GET /service/users -> array of users
GET /service/user/new -> return an empty user with default values which has no id
POST /service/user/new -> store a new user and create an id. return the saved user.
POST /service/user/:ID -> save an existing user. Return the saved user
DELETE /service/user/:ID -> delete an existing user

Angular-Services:

.factory( 'User', [ '$resource', function( $resource ){

    return $resource( '/service/user/:userId', { userId: '@id' } )
    [...]

}])

路由：

.when( '/users', {
    templateUrl: BASE + 'partials/user-list.html',
    controller: 'UserListCtrl' } )

.when( '/user/new', {
    templateUrl: BASE + 'partials/user-edit.html',
    controller: 'UserNewCtrl' } )

.when( '/user/:userId', {
    templateUrl: BASE + 'partials/user-edit.html',
    controller: 'UserEditCtrl' } )
...

Controllers:

UserListCtrl:

    $scope.data = User.get(...)

UserNewCtrl:

    $scope.user = User.get( { userId: "new" } )

...

请注意，我并不认为什么是最好的(tm)方法，但我想知道角度预期的方式是什么(我认为这应该产生最少的代码，因为它可以使用最默认的)。

编辑：

我在找整张照片。我想要的是一个答案，例如：“你可以使用在线3端点.，2条路线.和2个控制器.如果你用默认的方式这样做.”

Answer 1

对于你所要求的，没有任何角度的规定。这取决于您来决定实现细节。

通常，每个资源只使用两个控制器和模板：

1. ListController
2. FormController

表单控制器用于编辑和创建操作。使用路由定义中的resolve选项传递User.get()或User.new()以及指示这是编辑或创建操作的标志。然后，可以在FormController中使用此标志来决定要调用哪个保存方法。下面是一个简单的例子：

.when( '/users', {
  templateUrl: BASE + 'partials/user-list.html',
  controller: 'UserListCtrl' } )
.when( '/user/new', {
  templateUrl: BASE + 'partials/user-form.html',
  resolve: {
    data: ['User', function(User) { return User.new(); }],
    operation: 'create'
  }
  controller: 'UserFormCtrl' } )
.when( '/user/:userId', {
  templateUrl: BASE + 'partials/user-form.html',
  resolve: {
    data: ['User', '$route', function(User, $route) { return User.get($route.current.params.userId); }],
    operation: 'edit'
  }
  controller: 'UserFormCtrl' } )

你的表单控制器：

app.controller('UserFormCtrl', ['$scope', 'data', 'operation', function($scope, data, operation){
  $scope.data = data;
  $scope.save = function() {
    if (operation === 'edit') {
      // Do you edit save stuff
    } else {
      // Do you create save stuff
    }
  }
}]);

您可以更进一步，创建一个基本列表和表单控制器来移动诸如错误处理、服务器端验证通知等内容。实际上，对于大多数CRUD操作，您甚至可以将保存逻辑移到这个基本控制器上。

Answer 2

我对类似探索的研究已经引导我到了这个项目“角度模式-形式”https://github.com/Textalk/angular-schema-form。

对于这种方法..。您可以创建一个描述数据的JSON-Schema。然后用另一个描述"form“的小JSON-struct来增强它。查看不属于数据模式的特定信息)，并为您创建一个UI (表单)。

一个很酷的优点是，架构在验证数据(客户端和服务器端)方面也很有用，所以这是一个额外的好处。

你必须弄清楚哪些事件应该触发，得到/发布/.回到你的API。但这将是你的首选。点击API为每一个关键的笔画或经典提交按钮回发风格或在两者之间的时间自动保存。

为了保持这个想法，我认为可以使用StrongLoop来创建一个快速的API，这个API (再次)使用数据的模式(增加了一些存储细节)来定义API。

no <3使用该模式，请参阅[http://json-schema.org/]，它是此方法的核心。

(读作:不少于3 :)

Answer 3

你也许把事情搞混了。API级别的CRUD操作是使用$resource完成的，这些操作可能映射到UI，也可能不映射到UI。所以使用$resouce如果您将资源定义为

var r = $resource('/users/:id',null,   {'update': { method:'PUT' }});
r.query()  //does GET on /users and gets all users
r.get({id:1}) // does GET on /users/1 and gets a specific user
r.save(userObject)  // does a POST to /users to save the user
r.update({ id:1 }, userObject) // Not defined by default but does PUT to /users/1 with user object.

正如您所看到的那样，API是资源满的，但根本没有链接到任何UI视图。

对于视图，您可以使用您已经定义的约定，但没有任何特定的角度提供。