AngularJS 工厂返回未定义答案

【问题标题】：AngularJS factory return undefinedAngularJS 工厂返回未定义
【发布时间】：2015-12-22 03:25:06
【问题描述】：

几周前我开始了 AngularJS 编程。我想创建我的第一家工厂，但我对正在发生的事情感到困惑。

工厂：

var services =angular.module('services', ['ngResource']);

services.factory('UserSession',['$resource',function($resource) {
  var user = {};
  var loggedIn = false;
  var details={initstate:'for demo purpose'};

  user.authenticate = function(uname,pwd) {
    var apiauthentification = $resource('/api/authenticate');
    var tmp={
        username:uname,
        password:pwd
    };

    var auth = apiauthentification.save(tmp, function(){
        console.log(auth);
        if (auth.success){
            isLoggedIn=true;
        }
        details=auth;
    })
  };

  user.getDetails = function(){
    return details;
  };

  user.isLoggedIn = function() {
    return loggedIn;
  };


  return user;
}]);

控制器：

app.controller('LoginCtrl',['$scope','$resource','$location','UserSession',function($scope,$resource,$location,UserSession){

  $scope.login = function (){
    var tmp = UserSession.authenticate($scope.username,$scope.password);
    console.log('UserSession.isLoggedIn():'+UserSession.isLoggedIn());
    console.log ('Result authenticate:'+tmp);
    console.log('UserSession.getDetails():');
    console.log(UserSession.getDetails());
  };
}]);

<h3>Login page</h3>
<form>
    <label>Username</label>
    <input class="form-control" name="username" ng-model="username" required></input>

    <label>Password</label>
    <input class="form-control" name="password" ng-model="password" required></input>

    <button ng-click="login()">
        Test login
    </button>



    <label>result</label>
    <input class="form-control" name="loginresult" ng-model="logresult"></input>

</form>

控制台：

UserSession.isLoggedIn():false

Result authenticate:undefined

UserSession.getDetails():

Object {initstate: "for demo purpose"}

g {success: false, msg: "Authentification failed. User not found", $promise: d, $resolved: true}

    $promise: d
    
    $resolved: true
    
    msg: "Authentification failed. User not found"
    
    success: false
    
    __proto__: g

问题：

1- 为什么我的 tmp 变量未定义？

2- 我想我需要使用回调函数，但是如何设置呢？

【问题讨论】：

因为没有UserSession.authenticate()这样的功能。您需要致电UserSession.user.authenticate()

标签： angularjs

【解决方案1】：

1 - 已定义 tmp 变量，因为您没有在 authenticate 方法中返回任何内容。

2 - 您可以在 authenticate 方法中使用回调函数，如下所示：

user.authenticate = function(uname, pwd, callback) {
    var apiauthentification = $resource('/api/authenticate');
    var tmp = {
        username:uname,
        password:pwd
    };

    apiauthentification.save(tmp, function (response) {
        if (response.success){
            isLoggedIn=true;
            details=auth;
            return callback({success: true});
        }
        return callback({success: false});
    });
};

那就这样称呼吧：

UserSession.authenticate($scope.username,$scope.password, function (success) {
    // This code will be executed once authenticate method has finished
    if(success) {
        console.log('User authenticated');
    }
});

您可能需要对此代码进行一些调整以满足您的需要。

【讨论】：