angularjs - AngularJS最佳实践REST/CRUD

Question

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

特别是这里的 Angular-Way 。我的意思是使用最少代码和最默认 Angular 设置来达到此目的的方式。

我知道$ resource及其默认操作。我不确定的是如何实现/命名端点以及要使用的 Controller 。

对于此示例，我想实现一个简单的用户管理系统，该系统创建/更新/删除/列出用户。由于我是由我自己实现服务器端点的，因此我完全自由地以最友好的方式进行操作。

我喜欢的答案是:

服务器端点:

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

角服务:

.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' } )
...

Controller :

UserListCtrl:

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

UserNewCtrl:

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

...

请注意，我并不怀疑哪种方法是最好的(tm)方法，但我想知道 是Angular的方法是什么(我认为应该产生最少的代码，因为它可以使用最多的代码)默认)。

编辑:

我正在寻找整个图片。我想要的是一个答案，例如:“如果您使用默认值，则可以使用在线3个端点[...]，2个路由[...]和2个 Controller [...] ...”

Answer 1

您所要询问的内容没有Angular规定的方法。由您决定实现细节。

通常，每个资源我只使用两个 Controller 和模板:

ListController

FormController

窗体 Controller 用于编辑和创建操作。在路由定义中使用 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' } )

和您的表单 Controller :

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
    }
  }
}]);

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