Использование Kinvey.Social для входа с помощью Angular App и Promise API

Question

Я использую библиотеку Kinvey HTML5, чтобы попытаться создать приложение на стороне клиента, которое использует идентификационные данные Google для входа в систему. Кажется, все хорошо, что касается транзакции Oauth, но я пытаюсь переключить видимость моей кнопки входа в систему с помощью параметра scope и в обратном вызове Kinvey. connect метод, похоже, Angular не обнаруживает изменения.

Сервис:

  connect: function(successFn, failureFn) {
    return Kinvey.Social.connect(null, 'google',
      {
        success: successFn,
        failure: failureFn
      });
  }

Директива для ссылки на логин:

    $scope.login = function() {
      Login
        .connect(function(response) {
          $scope.loggedIn = true;
        },
        function(response) {
        });
    }

И шаблон директивы:

<div>
  <button ng-hide="loggedIn" type="button" class="btn" ng-click="login()">Login with Google ({{loggedIn}})</button>
  <div class="btn-group btn-small" ng-show="loggedIn">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
      Hello, {{user.socialData.name}} <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
      <li><a href="/profile">My Profile</a></li>
      <li><a href="/performance">My Performance</a></li>
      <li class="divider"></li>
      <li><a href="/logout" ng-click="logout()">Log Out</a></li>
    </ul>
 </div>
</div>

Цель состоит в том, чтобы переключить видимость кнопки входа и видимость раскрывающегося списка. Я не вижу причин, почему то, что я делаю, не должно работать. Даже используя $timeout смоделировать изменение loggedIn Значение производит правильное поведение.

Answer 1

Угловой должен быть уведомлен, когда внешний Kinvey.Social сервис возвращается, поэтому он может запустить цикл $digest. Это можно сделать с помощью $apply() функция $scope

$scope.login = function() {
  Login
    .connect(function(response) {
      $scope.$apply(function() { $scope.loggedIn = true; });
    },
    function(response) {
    });
}

При использовании собственного углового $http служба обрабатывает это для вас, но при использовании чего-то внешнего, это то, как Angular знает, чтобы запустить грязный цикл проверки, который должен вызвать ng-show Директива, которую вы используете.