Ionic을 사용한 모바일 애플리케이션 개발이 처음입니다. 로그인 및 로그 아웃시 데이터를 새로 고치려면 페이지를 다시로드해야하지만, $state.go('mainPage')다시로드하지 않고 사용자를 다시보기로 안내합니다. 그 뒤에있는 컨트롤러는 호출되지 않습니다.
Ionic에서 기록을 지우고 상태를 다시로드 할 수있는 방법이 있습니까?
답변:
프레임 워크에 오신 것을 환영합니다! 실제로 Ionic의 라우팅은 ui-router에 의해 구동됩니다 . 이 작업을 수행하는 몇 가지 다른 방법을 찾으려면 이 이전 SO 질문 을 확인해야 합니다.
상태를 다시로드하려면 다음을 사용할 수 있습니다.
$state.go($state.current, {}, {reload: true});
실제로 페이지를 다시로드하려면 (예 : 모든 것을 다시 부트 스트랩하려는 경우) 다음을 사용할 수 있습니다.
$window.location.reload(true)
행운을 빕니다!
$state.go($state.current, {}, {reload: true});cache:true상태 정의에서 (캐시가 생략 된 경우 기본값) 작동하지 않습니다 . #ionic 1.0.0-RC2 및 1.0.0에서 테스트되었습니다. 내 대답을 참조하십시오.
JimTheDev의 대답은 상태 정의가 cache:false설정 되었을 때만 작동한다는 것을 알았습니다 . 보기 캐시, 당신은 할 수있는 $ionicHistory.clearCache()다음 $state.go('app.fooDestinationView')당신은 캐시되지만 새로 고쳐야 하나 하나의 상태에서 이동하는 경우.
Ionic에 대한 간단한 변경이 필요하고 풀 요청을 만들었으므로 여기에서 내 대답을 참조하십시오. https://stackoverflow.com/a/30224972/756177
정답 :
$window.location.reload(true);
$window대신 사용하기 때문에window
나는 그것을 완료하는 데 도움이되는 해결책을 찾았습니다. 태그 설정 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
});
$scope.$on('$ionicView.beforeEnter', function(scopes, states) { if (states.fromCache) { ... } }
제 경우에는보기 만 지우고 컨트롤러를 다시 시작해야합니다. 이 스 니펫으로 내 의도를 얻을 수 있습니다.
$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});
이것이 작동하는 함수에서 이것을 사용하십시오.
컨트롤러는 한 번만 호출되며이 논리 모델을 유지해야합니다. 일반적으로 수행하는 작업은 다음과 같습니다.
나는 방법을 만든다 $scope.reload(params)
이 메서드의 시작 부분에서 $ionicLoading.show({template:..})사용자 지정 스피너를 표시하기 위해 호출 합니다.
may reload 프로세스가 완료되면 $ionicLoading.hide()콜백으로 호출 할 수 있습니다.
마지막으로 REFRESH 버튼 안에 ng-click = "reload(params)"
이 솔루션의 유일한 단점은 이온 항법 기록 시스템을 잃어버린다는 것입니다.
도움이 되었기를 바랍니다!
보기 변경 후 다시로드하려면 다음을 수행해야합니다.
$state.reload('state',{reload:true});
그 뷰를 새로운 "루트"로 만들고 싶다면 다음 뷰가 루트가 될 것이라고 ionic에게 말할 수 있습니다.
$ionicHistory.nextViewOptions({ historyRoot: true });
$state.go('app.xxx');
return;
뷰가 변경 될 때마다 컨트롤러를 다시로드하려면
app.config(function ($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
$ionicConfigProvider.views.maxCache(0);
.state (url : '/ url', controller : Ctl, templateUrl : 'template.html', cache : false) cache : false ==> 내 문제를 해결했습니다!
@ezain이 지적했듯이 필요할 때만 컨트롤러를 다시로드합니다. 컨트롤러를 다시로드하는 대신 상태를 변경할 때 데이터를 업데이트하는 또 다른 깨끗한 방법은 브로드 캐스트 이벤트를 사용하고 뷰에서 데이터를 업데이트해야하는 컨트롤러에서 이러한 이벤트를 수신하는 것입니다.
예 : 로그인 / 로그 아웃 기능에서 다음과 같이 할 수 있습니다.
$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");
};
이제 mainPage 컨트롤러에서 $ on 함수를 사용하여 다음과 같이 mainPage 컨트롤러 내에서 브로드 캐스트를 수신하여 뷰의 변경 사항을 트리거합니다.
$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 = '';
});