Почему переменные Angular.js недоступны в обратном вызове выполнения скрипта Cordova InAppBrowser

Я разрабатываю гибридное приложение на основе angular.js с использованием кордовы. Я столкнулся с проблемой отсутствия доступа к угловым переменным $ (например, $ rootScope) после выполнения следующих действий.

  1. Cordova и angular.js завершают инициализацию, как только это гибридное приложение запускается.
  2. Когда пользователь нажимает определенную кнопку для входа в социальную сеть, вызывается следующая функция loginTwitterAccount $scope.

  3. loginTwitterAccount открывает новое окно с помощью плагина Cordova InAppBrowser для загрузки внешней страницы авторизации, а не локальной. Эта авторизация относится к типу гранта «Код авторизации». Поэтому, если пользователь предоставляет доступ к моему гибридному приложению в открытом окне, мой внутренний сервер обменивается маркером доступа с сервером Twitter, а затем отправляет маркер доступа с сервера Twitter в открытое окно моего гибридного приложения.

    app.controller('LoginCtrl', function($scope, $rootScope) {
    ...
      $scope.loginTwitterAccount = function () {
        var ref = $window.open('/auth/login/twitter', '_blank', 'location=yes,toolbar=yes');    
        ref.addEventListener('loadstop', function(event) {
            if (event.url.match('/auth/login/twitter/callback/success')) {
                // content of this url includes access token data explained above.
                // so app can get the data as calling executeScript like the following
                if (event.url.match(successUrl)) {
                    ref.executeScript({
                        code: 'getResult();'
                    }, function (values) {
                        // I checked values[0].data has correct value that I want.
                        // At the other place, $rootscope.$on for 'social-login' is already registered.
                        $rootscope.$emit('social-login', values[0].data);
                        ref.close();
                    });
                 }
            }
        });
      };
    });
    

Проблема в том, что $rootscope.$emit не работает, как и другие угловые переменные с $, например $scope, не работают. Я не знаю, почему это происходит при использовании кордовы и angular.js. Есть ли недостающие моменты в этом случае? Заранее спасибо.


person Vine Brancho    schedule 26.05.2014    source источник


Ответы (1)


Я обнаружил проблему выше, потому что $rootScope.$emit вызывается вне мира angular.js. Чтобы решить эту проблему, я должен обернуть $rootScope.$emit $rootScope.$apply следующим образом.

        ...
        if (event.url.match(successUrl)) {
            ref.executeScript({
                code: 'getResult();'
            }, function (values) {
                // I checked values[0].data has correct value that I want.
                // At the other place, $rootscope.$on for 'social-login' is already registered.
                $rootScope.$apply(function () {
                    $rootScope.$emit('social-login', values[0].data);
                }
                ref.close();
            });
         }
         ...

Вы можете найти более подробную информацию о $apply по следующим ссылкам.

Как использовать $scope.$watch и $scope.$apply в AngularJS?

http://jimhoskins.com/2012/12/17/angularjs-and-apply.html

person Vine Brancho    schedule 02.06.2014
comment
У меня также есть аналогичная проблема, описанная здесь stackoverflow.com/q/34150840/1760421. Как вы думаете, $apply сработает и в моем случае? - person Yogesh; 08.12.2015