1

だから私は Ionic HTML5 Hybrid アプリに取り組んでいます。Firebase を使用してデータを保存し、Auth0 を認証に使用しています。すべてが非常にスムーズに進みましたが、AngularJS の初心者であるため、理解できないように見える小さな障害にぶつかりました。ここで $apply を使用する必要があるようですが、ドキュメントはこの点でかなり混乱しており、理解できません。

ユーザーがまだ自分のアカウントにリンクされていないソーシャル認証アカウントをリンクできるようにするビューがあります。そのユーザーのプロファイル内にある認証プロバイダーを確認することで機能します。HTML は以下のとおりです。

<ion-view title="Account">
  <ion-content class="has-header padding">
    <button class="button button-block button-positive icon-left icon ion-social-facebook" ng-if="facebookCheck() == false" ng-click="linkFacebook()"> Add Facebook Account</button>
    <button class="button button-block button-calm icon-left icon ion-social-twitter" ng-if="twitterCheck() == false" ng-click="linkTwitter()"> Add Twitter Account</button>
    <button class="button button-block button-dark icon-left icon ion-social-instagram" ng-if="instagramCheck() == false" ng-click="linkInstagram()"> Add Instagram Account</button>
    <br>  
    <button class="button button-assertive button-block" ng-click="logout()">Logout</button>
  </ion-content>
</ion-view>

こちらがコントローラー。これは、アプリをログアウトするか閉じて再度開くと、私が望むとおりに機能しますが、auth.profile の変更を監視して、ユーザーが利用可能なプロバイダーの 1 つにログインしてビューに戻った後、ボタンそのプロバイダーでログインすると、ビューから消えます。

.controller('AccountCtrl', function($scope, auth, $state, store) {

  $scope.logout = function() {
    auth.signout();
    store.remove('token');
    store.remove('profile');
    store.remove('refreshToken');
    $state.go('login');
  }

  $scope.profile = auth.profile;

  $scope.facebookCheck = function() {
     for (i = 0; i < $scope.profile.identities.length; i++) {
        if (angular.equals($scope.profile.identities[i].provider, "facebook")) {
                     return true;
        }
    }

    return false;
};

   $scope.twitterCheck = function() {
     for (i = 0; i < $scope.profile.identities.length; i++) {
        if (angular.equals($scope.profile.identities[i].provider, "twitter")) {
                     return true;
        }
    }

    return false;
};

   $scope.instagramCheck = function() {
     for (i = 0; i < $scope.profile.identities.length; i++) {
        if (angular.equals($scope.profile.identities[i].provider, "instagram")) {
                     return true;
        }
    }

    return false;
};

  $scope.linkTwitter = function () {
    var lock = new Auth0Lock('ywxuAvQN38sQqiiwYz3CJ3IsPUiEg94x', 'fanzee.auth0.com');

    lock.show({
      dict: {
        signin: {
          title: 'Link another account'
        }
      },
      connections: ['twitter'],
      authParams: {
        access_token: auth.accessToken
      }
    })
};

  $scope.linkFacebook = function () {
    var lock = new Auth0Lock('ywxuAvQN38sQqiiwYz3CJ3IsPUiEg94x', 'fanzee.auth0.com');

    lock.show({
      dict: {
        signin: {
          title: 'Link another account'
        }
      },
      connections: ['facebook'],
      authParams: {
        access_token: auth.accessToken
      }
    })
};

  $scope.linkInstagram = function () {
    var lock = new Auth0Lock('ywxuAvQN38sQqiiwYz3CJ3IsPUiEg94x', 'fanzee.auth0.com');

    lock.show({
      dict: {
        signin: {
          title: 'Link another account'
        }
      },
      connections: ['instagram'],
      authParams: {
        access_token: auth.accessToken
      }
    })
};

これの多くがサービスに含まれている可能性があることは知っていますが、これを適切に機能させるために物事を動かしていました。私はここで何をすべきですか？Angular に auth.profile への変更を監視させるにはどうすればよいですか? ありがとう。

4

1 に答える 1

0

ここでわかるように、プロファイルが変更されたときにイベントを発行し、コントローラーでそれをキャッチします。イベント キャッチャー部分を削除すると、ボタンをクリックするとプロファイルが変更されますが、$scope.profile値は更新されません。

このプランカーを参照してください:プランカーの例

于 2015-08-26T07:37:36.627 に答える