将数据发布到AngularJs中的Form Data类型的API中

时间:2014-06-05 09:04:43

标签: angularjs

我是angularjs的新手,我想以"表格数据"的形式发布数据。类型,而不是查询字符串。我使用的代码:

angular.module('odeskApp') 
 .factory('Password', function ($http, $q) {
    return {
        update: function (pwd) {
            var deferred = $q.defer();

            $http({
                url: 'http://example.com/api/user/password',
                method: 'POST',
                data: $.param({ 
     'password': pwd 
    }),
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
     'X-Requested-With': 'XMLHttpRequest'
                    }
            })
                .success(function (data) {
                    $('#changePasswordAlert').html('<div class="alert alert-success"><b>Successfully Done!</b> Change password process completed.</div>');
     $('#changePasswordAlert .alert').mouseout(function(){ $(this).fadeOut('slow'); });
                    deferred.resolve(data); //resolve data
               })
                .error(function (err) { 
     $('#changePasswordAlert').html('<div class="alert alert-danger"><b>Failed!</b> Change password process failed.</div>');
     deferred.reject();
     $('#changePasswordAlert .alert').mouseout(function(){ $(this).fadeOut('slow'); });
    });
            return deferred.promise; 
        }
    };
});

任何可能的帮助或建议将不胜感激。

由于

1 个答案:

答案 0 :(得分:0)

最好的方式是使用简单的$ http.post:

$http.post(url, {'password': pwd}, configs)
.then(sucessFunc, failFunc);

我抽象了完整的例子,让它变得干净。如果你想我可以把完整的代码。

编辑:完整示例

angular.module('odeskApp') 
 .factory('Password', function ($http) {
    var url = 'http://example.com/api/user/password';
    // you can remove the configs if they are not needed...
    var configs = {
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
        'X-Requested-With': 'XMLHttpRequest'
      }
    };
    return {
        update: function (pwd) {
          $http.post(url, {'password': pwd}, configs)
            .then(function (data){ return data; });
        }
    };
});

这应该可以正常工作。我没有在失败时添加Refect,因为它会自动将拒绝发送到promises队列。 另外$ http返回promises,所以不需要使用$ q。 不应在工厂中使用Html操作。这就是为什么我从我的例子中删除它。请参阅角度文档的一些指南。 基本上你应该有一个使用控制器的模板,它调用这个服务,然后使用$ scopes来控制控制器和视图之间的消息。 希望这能帮到你。