developer tip

Ionic Framework를 사용하여 로그인 / 로그 아웃시 기록 지우기 및 페이지 다시로드

optionbox 2020. 10. 9. 11:05
반응형

Ionic Framework를 사용하여 로그인 / 로그 아웃시 기록 지우기 및 페이지 다시로드


Ionic을 사용한 모바일 애플리케이션 개발이 처음입니다. 로그인 및 로그 아웃시 데이터를 새로 고치려면 페이지를 다시로드해야하지만, $state.go('mainPage')다시로드하지 않고 사용자를 다시보기로 안내합니다. 그 뒤에있는 컨트롤러는 호출되지 않습니다.

Ionic에서 기록을 지우고 상태를 다시로드 할 수있는 방법이 있습니까?


프레임 워크에 오신 것을 환영합니다! 실제로 Ionic의 라우팅은 ui-router에 의해 구동됩니다 . 작업을 수행하는 몇 가지 다른 방법을 찾으려면 이전 SO 질문확인해야 할 것입니다 .

상태를 다시로드하려면 다음을 사용할 수 있습니다.

$state.go($state.current, {}, {reload: true});

실제로 페이지를 다시로드하려면 (예 : 모든 것을 다시 부트 스트랩하려는 경우) 다음을 사용할 수 있습니다.

$window.location.reload(true)

행운을 빕니다!


JimTheDev의 대답은 상태 정의가 cache:false설정 되었을 때만 작동한다는 것을 알았습니다 . 보기 캐시, 당신은 할 수있는 $ionicHistory.clearCache()다음 $state.go('app.fooDestinationView')당신은 캐시되지만 새로 고쳐야 하나 하나의 상태에서 이동하는 경우.

Ionic에 대한 간단한 변경이 필요하고 풀 요청을 만들었으므로 여기에서 내 대답을 참조하십시오. https://stackoverflow.com/a/30224972/756177


정답 :

$window.location.reload(true);

나는 그것을 완료하는 데 도움이되는 해결책을 찾았습니다. 태그 설정 cache-view="false"으로 ion-view문제가 해결되었습니다.

<ion-view cache-view="false" view-title="My Title!">
  ....
</ion-view>

페이지 새로 고침은 최선의 방법이 아닙니다.

뷰 자체를 다시로드하지 않고도 데이터를 다시로드하기위한 상태 변경 이벤트를 처리 할 수 ​​있습니다.

여기에서 ionicView 수명주기 에 대해 읽어보십시오 .

http://blog.ionic.io/navigating-the-changes/

데이터 재로드를 위해 beforeEnter 이벤트를 처리하십시오.

$scope.$on('$ionicView.beforeEnter', function(){
  // Any thing you can think of
});

제 경우에는보기 만 지우고 컨트롤러를 다시 시작해야합니다. 이 스 니펫으로 내 의도를 얻을 수 있습니다.

$ionicHistory.clearCache([$state.current.name]).then(function() {
  $state.reload();
}

캐시는 여전히 작동하며보기 만 지워진 것 같습니다.

ionic --version 1.7.5를 말합니다.


위에서 언급 한 솔루션 중 어느 것도 localhost! 와 다른 호스트 이름에 대해 작동하지 않았습니다 .

호출이 호출 되기 전에 Angular 변경 리스너를 호출하지 않도록 notify: false전달하는 옵션 목록에 추가 해야했습니다 . 최종 코드는 다음과 같습니다.$state.go$window.location.reload

$state.go('home', {}, {reload: true, notify: false});

>>> 편집-브라우저에 따라 $ timeout이 필요할 수 있습니다. >>>

$timeout(function () { $window.location.reload(true); }, 100);

<<< 편집 종료 <<<

이에 대한 자세한 내용은 ui-router 참조 .


나는 웹 사이트를 보았을 때 angularjs를 사용하여 페이지 새로 고침을 시도했지만 혼란 스러웠지만 코드가 코드에서 작동하지 않았고 페이지를 다시로드하는 솔루션이 있습니다.

$state.go('path',null,{reload:true});

이것이 작동하는 함수에서 이것을 사용하십시오.


스크롤바가 작동하도록 상태를 다시로드해야했습니다. 다른 주 ( '등록')를 통해 올 때 작동하지 않았습니다. 등록 후 앱이 강제 종료되었다가 다시 열리면, 즉 '홈'상태로 바로 이동 한 경우 스크롤바가 작동합니다. 위의 솔루션 중 어느 것도 작동하지 않았습니다.

등록 후 다음을 교체했습니다.

$state.go("home");

window.location = "index.html"; 

앱이 다시로드되고 스크롤바가 작동했습니다.


컨트롤러는 한 번만 호출되며이 논리 모델을 유지해야합니다. 일반적으로 수행하는 작업은 다음과 같습니다.

나는 방법을 만든다 $scope.reload(params)

이 메서드의 시작 부분에서 $ionicLoading.show({template:..})사용자 지정 스피너를 표시하기 위해 호출 합니다.

may reload 프로세스가 완료되면 $ionicLoading.hide()콜백으로 호출 할 수 있습니다.

마지막으로 REFRESH 버튼 안에 ng-click = "reload(params)"

이 솔루션의 유일한 단점은 이온 항법 기록 시스템을 잃어버린다는 것입니다.

도움이 되었기를 바랍니다!


If you want to reload after view change you need to

$state.reload('state',{reload:true});

If you want to make that view the new "root", you can tell ionic that the next view it's gonna be the root

 $ionicHistory.nextViewOptions({ historyRoot: true });
 $state.go('app.xxx');
 return;

If you want to make your controllers reload after each view change

app.config(function ($stateProvider, $urlRouterProvider, $ionicConfigProvider) {

$ionicConfigProvider.views.maxCache(0);

.state(url: '/url', controller: Ctl, templateUrl: 'template.html', cache: false) cache: false ==> solved my problem !


As pointed out by @ezain reload controllers only when its necessary. Another cleaner way of updating data when changing states rather than reloading the controller is using broadcast events and listening to such events in controllers that need to update data on views.

Example: in your login/logout functions you can do something like so:

$scope.login = function(){
    //After login logic then send a broadcast
    $rootScope.$broadcast("user-logged-in");
    $state.go("mainPage");
};
$scope.logout = function(){
   //After logout logic then send a broadcast
   $rootScope.$broadcast("user-logged-out");
   $state.go("mainPage");
};

Now in your mainPage controller trigger the changes in the view by using the $on function to listen to broadcast within the mainPage Controller like so:

$scope.$on("user-logged-in", function(){
     //update mainPage view data here eg. $scope.username = 'John';
});

$scope.$on("user-logged-out", function(){
    //update mainPage view data here eg. $scope.username = '';
});

I tried many methods, but found this method is absolutely correct:

$window.location.reload();

Hope this help others stuck for days like me with version: angular 1.5.5, ionic 1.2.4, angular-ui-router 1.0.0

참고URL : https://stackoverflow.com/questions/25192172/clear-history-and-reload-page-on-login-logout-using-ionic-framework

반응형