Question

我使用Auth0进行登录，我有以下代码：

$scope.login = function () {
        $scope.loginFailed = false;
        $scope.loading = true;

        loaderService.show();

        let credentials = {
            email: $scope.email,
            password: $scope.password
        };
        principal.signin(credentials)
            .then(() => {
                $state.go('main.index');
            })
            .catch(e => {
                showError(e.error_description);
                loaderService.hide();
            });
    };

principle服务包含登录功能：

signin(credentials) {
        return new Promise((resolve, reject) => {
            this.auth.signin({
                connection: 'Username-Password-Authentication',
                email: credentials.email,
                sso: false,
                password: credentials.password,
                authParams: {
                    scope: 'openid name email'
                }
            }, this.onLoginSuccess.bind(this, resolve, reject), this.onLoginFailed.bind(this, reject));
        });
    }

因此，正如您所见，我创建了promise并将解析/拒绝传递给Auth0回调。回调非常简单：

onLoginSuccess(resolve, reject, profile, token) {
        let userData = this.collectData(profile);
        ... store token
        return this.syncCurrent(userData) //request to server
            .then(() => {
                return resolve();
            })
            .catch(() => {
                this.signOut();
                return reject();
            });
}

onLoginFailed(reject, error) {
        return reject(error.details);
}

所以，让我们回到第一个片段。有以下代码：

principal.signin(credentials)
                .then(() => {
                    $state.go('main.index');
                })
                .catch(e => {
                    showError(e.error_description);
                    loaderService.hide();
                });

当我使用正确的电子邮件/密码重定向工作正常，我看到主页。但是，当我使用错误的电子邮件/密码时，我看到catch块被执行，我看到调试器中的值已更改，但我没有看到错误阻止并且加载图像没有消失。这在html中不是问题，因为我现在正在重构代码，上面的所有代码都在一个文件中，我没有使用promises，一切正常。我尝试在showError函数之前执行principal.signin(credentials)方法，仅用于测试，我看到错误并且加载图像被隐藏了。所以，我认为问题在于承诺和捕获阻塞，但我不知道在哪里。

PS。 showError如下：

function showError(errorText) {
        $scope.loading = false;
        $scope.loginFailed = true;
        $scope.loginErrorMessage = errorText;
    }

Answer 1

此问题的原因是使用非Angular承诺。 Angular promise，即$q服务，在解析之后负责调用摘要周期。摘要周期是Angular 1中变更检测的实现，即通知观察者并启用行动的内容。

使用$q解决了这个问题。

代码的then部分可能有效，因为它调用$state.go()，后者又调用摘要周期。 catch部分没有，所以变化从来没有机会解雇观察者。

使用Promise.catch时，Angular，Binding不起作用

1 个答案: