Angularjs:使用"。然后"并得到回应

时间:2014-08-31 14:09:08

标签: javascript ruby-on-rails angularjs http

我想发送一个http请求并获得此请求的响应。我想如果保存数据,我得到数据库信息,如果没有保存,我会收到错误。为此,我想在angularjs中使用.then。我创建angularjs控制器和服务来做到这一点。我在angularjs部分中有以下代码:

bolouk.js

'use strict';
var app = angular.module('app');
app.controller('BoloukCtrl', ['$scope', 'Bolouks', function($scope, Bolouks){
$scope.save = function(){
        Bolouks.create($scope.bolouk).then(function(data){
        $scope.saveBolouk = data;
        },function(err){
                $scope.err = err;
            }
        );
    };
}]);

boloukService.js

'use strict';
var app = angular.module('boloukService', ['ngResource']);
app.factory('Bolouks', function($resource) {
    return $resource('/api/bolouks.json', {}, {
        create: { method: 'POST', isArray: false }
    });
});

我在rails服务器中有以下代码: bolouks_controller.rb

  def create
    @bolouk = Bolouk.create(bolouk_params)
    if @bolouk.valid?
      #@bolouk.save
      respond_with @bolouk, :location => api_bolouks_path
    else
      respond_with @bolouk.errors, :location => api_bolouks_path
    end
  end
  private
  def bolouk_params
    params.require(:bolouk).permit(:boloukcode, :north, :south, :east, :west)
  end

请求正确发送到rails服务器并且数据保存到数据库权限,但是我无法得到请求的响应,当我运行function`时,我在chrome console中得到以下错误:

TypeError: undefined is not a function
    at Scope.$scope.save (http://localhost:3000/assets/controllers/bolouk.js?body=1:19:39)
    at http://localhost:3000/assets/angular.js?body=1:10973:21
    at http://localhost:3000/assets/angular.js?body=1:20088:17
    at Scope.$eval (http://localhost:3000/assets/angular.js?body=1:12752:28)
    at Scope.$apply (http://localhost:3000/assets/angular.js?body=1:12850:23)
    at HTMLFormElement.<anonymous> (http://localhost:3000/assets/angular.js?body=1:20087:21)
    at HTMLFormElement.jQuery.event.dispatch (http://localhost:3000/assets/templates/jquery-1.10.2.js?body=1:4627:9)
    at HTMLFormElement.elemData.handle (http://localhost:3000/assets/templates/jquery-1.10.2.js?body=1:4295:46) 

我想我没有在angularjs控制器中正确使用.then,我也检查了$q方法,但又一次得到了这个错误。有谁有想法解决这个问题?

2 个答案:

答案 0 :(得分:0)

var app = angular.module('app',['boloukService']);


app.controller('BoloukCtrl', ['$scope', 'Bolouks', function($scope, Bolouks){
    $scope.save = function(){
        var user = Bolouks.get();
        user.get(function(resp) {
            //request successful
        }, function(err) {
            //request error
        });
    };
}]);

angular.module('boloukService', ['ngResource']);
    app.factory('Bolouks', function($resource) {
    var savedData = {}

    function get() {
        return  $resource('/api/bolouks.json', {}, {
            create: { method: 'POST', isArray: false}
        });
    }
    return {
        get: get
    }
});

试试这个:)

答案 1 :(得分:0)

您已将两个模块分配到同一个变量中。这可能会与您的代码冲突。所以使用这段代码:

bolouk.js:

'use strict';
var app = angular.module('app',['ngResource']);
app.controller('BoloukCtrl', ['$scope', 'Bolouks', function($scope, Bolouks){
$scope.save = function(){
        Bolouks.create($scope.bolouk).$promise.then(function(data){
        $scope.saveBolouk = data;
        })
        .catch(function (err) {
          console.log(err);

      })
    };
}]);

boloukService.js:

'use strict';

app.factory('Bolouks', function($resource) {
    return $resource('/api/bolouks.json', {}, {
        create: { method: 'POST', isArray: false }
    });
});