如何让AngularJS检查和使用Rails后端的数据？

就像说我想确保有人注册不使用预先存在的电子邮件地址。 如何使AngularJS文件与Rails用户模型/用户数据库进行交互来查看？ NodeJS在这里是必要的吗？ 这可以通过一个“独特的”指令来完成（我想遵循的方法）？

我正在使用AngularJS的1.3.0-beta.18版本。 我不知道这是如何改变的东西 – 仍然使用$parsingfunction？ 如何使用$ validatorspipe道setValidity？

编辑：我从http://www.ng-newsletter.com/posts/validations.html遇到这个例子。 我如何适应一个典型的Rails设置 – 用户控制器，用户模型和用户数据库？ 如果在用户控制器中有一个“唯一”方法，查询用户模型以查看是否有包含该电子邮件参数的条目，该怎么办？ 这个“唯一的”方法是由“唯一的”AngularJS指令调用的，并且在registry单中调用该指令。 我已经有一个“独特的”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); }); }); } } }]);

最新编辑8/29/2014：所以这是我正在使用的代码，但它不工作。 表单提交与FormCtrl控制器和用户工厂很好，但UniqueEmail工厂和EnsureUnique指令不起作用。 所有标准的AngularJS指令（如ng-minlength）在HTML表单中工作正常。

我有Rails的路线API /用户/唯一和用户/唯一。 我不太确定哪个是用的，我假设api / users / unique？

这是我的Rails控制器方法的“唯一”代码： 

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

只需通过$ http进行angular度请求，并在您的rails-app中提供其余端点。

理想情况下，你使用类似$ resource或restangular的东西，因为通常你想做一些CRUD操作，而这正是rails非常合适的地方。

另一个select是使用它与Angular Rails模板 。 这里是一个很好的职位，关于如何做到这一点 。 这个链接也是最近发布的一个ng-newsletters

Interesting Posts