angularjs .then()不起作用(然后不是函数)

罗宾·K

我在使用AngularJS(v1.3.15)和Angular-Route开发游戏想法的简单GUI时遇到了一些问题。无论如何,对于注册,我想在输入时预先检查用户名的可用性。我设置了一个$ watch,调用工厂服务来获取$ http.post答案,但是在我的控制器中,出现错误“ fwMainService.checkUsernameAvailability(...)。然后不是函数”。我对每个拼写,语法和逻辑进行了三重检查(顺便说一句,我是Angular的新手)。其他所有工厂功能都按预期运行。

是否因为checkUsernameAvailability()应该返回一个Promise,而不是字符串?

有任何想法吗?提前致谢!

我的工厂:

"use strict";

fwApp.factory('fwMainService', function ($http) {

var mFac = {};

mFac.checkUsernameAvailability = function (username) {
    if(username != '') {
        if(username.length >= 3) {
            $http.post('api/user/usernameInUse.php', {newUser: username})
            /* returns '1' if in use, '0' if free */
            .success(function (res) {
                if(res == '1') { // Username in use
                    return 'In Use!';
                } else if(res == '0') {
                    return 'Free!';
                }
            })
            .error(function (error) {
                console.log("username check error: ", error);
            });
        } else {
            return 'Username too short!';
        }
    } else {
        return ''; // if empty, do not check
    }
};

[...]

// Public API
return {
    checkUsernameAvailability: function (username) {
        return mFac.checkUsernameAvailability(username);
},
[...]

我的控制器:

"use strict";    

fwApp.controller('IndexCtrl', 
         ['$scope', '$http', '$timeout', '$location', 'fwMainService', 
function ( $scope,   $http,   $timeout,   $location,   fwMainService) {

/* username input field model = newUser.username */
$scope.$watch("newUser.username", function (newValue, oldValue) {
    if(angular.equals(newValue, oldValue)) {
        return;
    }
    fwMainService.checkUsernameAvailability(newValue).then(function (res) {
        console.log("return", res.data);
        $scope.newUserMsg = res.data; // Setting infobox to "Free!" or "In Use!"
    }, function (error) {
        console.log("username check Error:", error);
    });

});

[...]

编辑#1:我添加了一个jsfiddle:http : //jsfiddle.net/Kyrm/71kz617g/6/也许有人可以使用它...

耳朵D

jsFiddle需要一些调整才能工作,但是总的来说,您需要做的是:

  • 在mFac.checkUsernameAvailability函数中,您需要返回$ http.post()结果。
  • 您需要向工厂注入$ q。
  • 而不是返回res.data,而是返回res
  • 在所有出现返回字符串的情况下,都返回$ q.when(str)(其中str是字符串)。这样可以确保函数中所有存在的路径都返回一个Promise(然后在所有情况下都可以调用)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章