javascript - 使用另一个库中的事件更新 Angular 上的某些内容

Question

我是一个完全的 Angular 菜鸟，但我试图了解如何执行以下操作。

我正在使用 keycloak 和 keycloak.js ( https://docs.jboss.org/keycloak/docs/1.1.0.Final/userguide/html/ch08.html )，它们有自己的自定义回调，例如 onAuthSuccess。如果我想更新诸如登录名之类的内容，应该如何调用此 onAuthSuccess。我应该在 Angular 之外创建一个函数并调用范围，这看起来很困惑。或者有没有办法以 Angular 方式调用此函数，例如在提供程序或工厂中，但我不知道如何执行此操作。

更新********

在普通的 javascript 中，你会得到类似这样的东西

var keycloak = new Keycloak("path/to/keycloak.json");
keycloak.onAuthSuccess(){
//code to do on auth success
}

为了更新我范围内的某些内容，我必须做类似的事情

var scope = angular.element($("#outer")).scope();

但是看起来很乱。

有没有办法在我的项目中做到这一点。

Answer 1

您可能想要调用$apply()

$apply() is used to execute an expression in angular from outside of the angular framework. (For example from browser DOM events, setTimeout, XHR or third party libraries). Because we are calling into the angular framework we need to perform proper scope life cycle of exception handling, executing watches.

我对这个库不熟悉，但是从您分享的内容来看，一个示例可能包括......

var keycloak = new Keycloak("path/to/keycloak.json");
keycloak.onAuthSuccess(){
    // do stuff - likely modify $scope
    $scope.$apply();
}

查看 AngularJS $apply() docs还有更多explanation on the project wiki了解更多关于原因的见解。