ruby-on-rails - 如何让AngularJS检查并使用Rails后端的数据？

Question

就像说我想确保注册的人没有使用预先存在的电子邮件地址。如何使 AngularJS 文件与 Rails 用户模型/用户数据库交互以查看该信息？这里需要 NodeJS 吗？这可以通过“独特”指令(我希望遵循的方法)来完成吗？

我使用的是 AngularJS 1.3.0-beta.18 版本。我不知道这会如何改变 - $parse 函数仍然使用吗？如何使用 $validators 管道 setValidity？

编辑: 我从 http://www.ng-newsletter.com/posts/validations.html 看到这个例子。如何使其适应典型的 Rails 设置 - 用户 Controller 、用户模型和用户数据库？如果我在用户 Controller 中有一个“唯一”方法来查询用户模型以查看是否存在带有该电子邮件参数的条目，该怎么办？这个“唯一”方法由“唯一”AngularJS 指令调用，并且该指令在注册表单中调用。当我执行“rake 路由”时，我确实已经出现了一个“唯一”JSON 路由，以及一个“唯一”HTML 路由。我知道如何在表单中调用指令以及如何在表单中进行错误检查，因此这不是问题。

app.directive('ensureUnique', ['$http', function($http) {
  return {
    require: 'ngModel',
    link: function(scope, ele, attrs, c) {
      scope.$watch(attrs.ngModel, function() {
        $http({
          method: 'POST',
          url: '/api/check/' + attrs.ensureUnique,
          data: {'field': attrs.ensureUnique}
        }).success(function(data, status, headers, cfg) {
          c.$setValidity('unique', data.isUnique);
        }).error(function(data, status, headers, cfg) {
          c.$setValidity('unique', false);
        });
      });
    }
  }
}]);

最新编辑 2014 年 8 月 29 日: 这是我正在使用的代码，但它不起作用。使用 FormCtrl Controller 和 User 工厂可以很好地进行表单提交，但 UniqueEmail 工厂和 EnsureUnique 指令不起作用。所有标准 AngularJS 指令(如 ng-minlength)在 HTML 表单中都可以正常工作。

我有 Rails 路线 api/users/unique 和 users/unique。我不太确定使用哪个，我假设 api/users/unique？

这是我的 Rails Controller 方法“独特”代码:

class UsersController < ApplicationController
include AngularController



def new
  @user = User.new
  respond_with @employee
end

def create
        @user = User.create(params.permit(:email, :name, :password,  :password_confirmation))
        if @user.save
        session[:@user_id] = @user.id
        redirect_to root_url
        else
        render 'new'
        end

end 
def unique
if User.exists?(:email => params[:email])
return true
end
end
end

module AngularController
  extend ActiveSupport::Concern

  included do
    respond_to :html, :json
    around_action :without_root_in_json
  end

  def without_root_in_json
    ActiveRecord::Base.include_root_in_json = false
    yield
    ActiveRecord::Base.include_root_in_json = true
  end
end

这是我的 AngularJS 代码:

     mainapp.factory("UniqueEmail", function($resource) {
     return {
      states: $resource('/users/unique.json', {}, {
        query: { method: 'GET', params: {}, isArray: false }
      })
    };
  });

mainapp.factory("User", function($resource) {
  return $resource("/users/:id", {
    id: "@id"
  });
});


app.directive('ensureUnique', ['$http', function($http) {
  return {
    require: 'ngModel',
    link: function(scope, ele, attrs, c) {
      scope.$watch(attrs.ngModel, function(value) {
        $http.get({
          url: '/users/unique',
          params: {"email": value}
        }).success(function(data, status, headers, cfg) {
          c.$setValidity('unique', false);
        }).error(function(data, status, headers, cfg) {
          c.$setValidity('unique', true);
        });
      });
    }
   }
}]);

mainapp.controller("FormCtrl", function($scope, User, UniqueEmail) {
  $scope.user = new User();
  $scope.users = User.query();
  $scope.password_confirmation = null;

  $scope.add = function() {
  $scope.users.push(User.save({
  name: $scope.user.name,
  email: $scope.user.email,
  password: $scope.user.password,
  password_confirmation: $scope.user.password_confirmation
  }));
  return $scope.user = new User();
  };
  return $scope["delete"] = function($index) {
   if (confirm("Are you sure you want to delete this user?")) {
  $scope.users[$index].$delete();
  return $scope.users.splice($index, 1);
  }
  };
  });

Answer 1

只需通过 $http 发出 Angular 请求，并在您的 Rails 应用程序中提供其余端点。

理想情况下，您使用类似 $resource 的内容或restangular ，因为通常您想要进行一些 CRUD 操作，而这正是 Rails 非常适合的地方。

另一个选项是将其与 Angular Rails Templates 一起使用。 here is a good post, on how to do this 。此链接也与最后一个 ng-newsletters 一起发布。