有angular的ui路由器没有注入到控制器的决心

我刚刚开始使用Angular和Express,面临艰难的时刻。 我来自Java背景,想学习Angular和Express,因此试图构build一个小应用程序。

我正在尝试做的 :我已经给用户一个密码重置链接,以便改变他的密码。 链接是这样的:

本地主机:9000 / RESET /:令牌

现在,我创build了一个简单的视图,其中显示了一个input框,如果令牌有效,则更改其密码,否则基于ng-show angular属性显示令牌无效时显示错误。

问题 :在我可以渲染我上面创build的视图之前,我想让ui-router检查:token是否有效。 我将在我的控制器中使用令牌的有效性信息来控制上面提到的ng-show属性。

读完这个之后,我试图利用$ stateProvider.statefunction进行parsing,以获得令牌validation的响应作为先决条件。 这将帮助我渲染实际的视图,我正在使用ng-show技术来显示错误消息或input框来更改基于ui-routerparsingpromiseObject的密码。

现在是什么问题?

那么,在我头脑太久之后,我决定在这里发表我的问题。 任何人都可以帮我吗?

我的问题:

1.我能够从api调用中获取数据/错误,但不知何故,ui-router并没有将其注入到控制器中。 谁能告诉我,我在这里做错了什么?

2.现在,如果令牌无效,我将从后端api返回404响应。 但前端的工厂方法把它作为err(这是在Node.js中预期?)和err被抛出导致deferred.reject()。 现在,如果我使用ui路由器定义,如果承诺没有解决,那么视图将不会被渲染,对吗? 有什么办法可以将这个错误也传递给我的控制器? 我要求通过err的原因是,我的视图的ng显示逻辑是基于响应代码(4xx / 2xx),这取决于我将显示错误消息还是input框。

代码片段:

调用其余api的工厂方法:

isPasswordResetTokenValid: function(token, callback) { var cb = callback || angular.noop; var deferred = $q.defer(); return User.getUserByPasswordResetToken(token, function(data) { deferred.resolve(data); return cb(data); }, function(err) { deferred.reject(err); return cb(err); }.bind(this)).$promise; } 'use strict'; angular.module('scrubApp') .config(function ($stateProvider) { $stateProvider .state('passwordreset', { url: '/reset/:token', templateUrl: 'app/account/passwordreset/passwordreset.html', resolve: { promiseObj2: function($stateParams, Auth){ var token = $stateParams.token; console.log(token); var response = Auth.isPasswordResetTokenValid({token: token}) .then( function(response) { console.log(response); // shows response if(response.status == 404) { //$scope.token-expiry = true; return response; } if(response.status == 200) { // $scope.user = response.data; } }) .catch( function(err) { console.log(err); // shows error return err; }); } }, controller: 'ResetPasswordCtrl' }); }); 

ResetPasswordCtrl控制器:

 'use strict'; angular.module('myApp') .controller('ResetPasswordCtrl', function ($scope, User, Auth, Mailer, $stateParams, promiseObj2) { $scope.errors = {}; $scope.user = {}; console.log(promiseObj2); // This is coming undefined $scope.isTokenExpired = promiseObj2; // Not able to inject promiseObj2 $scope.isFormSubmitted = false; }); 

提前致谢

       

网上收集的解决方案 "有angular的ui路由器没有注入到控制器的决心"

你的决心promiseObj2应该从promise服务返回一个promise,这样你的控制器就会等待,直到promise被解决。

 return Auth.isPasswordResetTokenValid({token: token}) 

更新

如果你想处理你的令牌请求失败的一些逻辑,那么你可以在你的诺言中处理它,它可以做一些事情,如

  1. 您可以使用$state.go('login')$state.go('error')页面redirect到其他页面。

 promiseObj2: function($stateParams, Auth, $state){ var token = $stateParams.token; console.log(token); return Auth.isPasswordResetTokenValid({token: token}) //added return here .then( function(response) { console.log(response); // shows response if(response.status == 404) { $state.go('error') } if(response.status == 200) { return response; } }) .catch( function(err) { console.log(err); // shows error return err; }); } 
  1. 如果你想显示html页面,如果发生错误,那么你也可以返回的promiseObj2对象的promiseObj2数据将有错误消息的信息。 这样错误信息就会return给控制器

 promiseObj2: function($stateParams, Auth, $state){ var token = $stateParams.token; console.log(token); return Auth.isPasswordResetTokenValid({token: token}) //added return here .then( function(response) { console.log(response); // shows response if(response.status == 404) { return {status: 404, data: "doen't found resource"} } if(response.status == 200) { return response; } }) .catch( function(err) { console.log(err); // shows error return err; }); } 

然后在控制器内部,我们将parsingpromiseObj2对象的承诺,然后在promiseObj2函数中得到错误的值。

 angular.module('myApp') .controller('ResetPasswordCtrl', function ($scope, User, Auth, Mailer, $stateParams, promiseObj2) { $scope.errors = {}; $scope.user = {}; promiseObj2.then(function(resp){ console.log(resp) $scope.isTokenExpired = resp.isTokenExpired; }, function(err){ console.log(err) }) }); 

更新

如果我们想要处理一个服务器返回4XX状态的条件,这意味着我们的ajax将会调用不会返回承诺的catch函数。 我们可以通过使用$q创build定制的承诺来解决这个问题,我们将从promiseObj2parsing它

 promiseObj2: function($stateParams, Auth, $state, $q){ var token = $stateParams.token, deffered = $q.defer(); console.log(token); Auth.isPasswordResetTokenValid({token: token}) //added return here .then( function(response) { console.log(response); // shows response if(response.status == 404) { //return {status: 404, data: "doen't found resource"} deffered.resolve({status: 404, data: "doen't found resource"}); } if(response.status == 200) { //return response; deffered.resolve(response); } }) .catch( function(err) { console.log(err); // shows error deffered.resolve(err); }); return deffered.promise; }