뷰가 열리거나 표시될 때마다 컨트롤러 기능 실행
아래쪽에 3개의 이온탭이 있는 클래식한 3버튼 메뉴를 사용하는 Angular+ionic 앱을 만들고 있습니다.사용자가 탭을 클릭하면 해당 템플릿이 UI 라우터를 통해 열립니다.
다음과 같은 상태가 있습니다.
$stateProvider
.state('other', {
url: "/other",
abstract: true,
templateUrl: "templates/other/other.html"
})
템플릿에서 다음과 같은 작업을 수행합니다.
<ion-nav-view name="other" ng-init="doSomething()"></ion-nav-view>
컨트롤러에 doSomething() 함수를 작성하여 수동으로 호출할 수 있습니다.하지만 그것은 나에게 같은 문제를 준다.누군가가 보기를 열 때마다 doSomething() 함수를 여러 번 호출하는 방법을 이해할 수 없습니다.
현재 doSomething() 함수는 정상적으로 호출되지만 사용자가 보기/탭을 처음 열었을 때만 호출됩니다.사용자가 해당 보기 또는 탭을 열 때마다 (지올로케이션을 업데이트하기 위한) 함수를 호출하고 싶습니다.
그것을 구현하는 올바른 방법은 무엇일까요?
디폴트로는 컨트롤러는 캐시이므로 컨트롤러는 1회만 기동합니다. 캐시를 ..config(..).state
해서 해 주세요.cache
" " " option to " " option to " )false
::
.state('myApp', {
cache: false,
url: "/form",
views: {
'menuContent': {
templateUrl: "templates/form.html",
controller: 'formCtrl'
}
}
})
자세한 내용은 http://ionicframework.com/docs/api/directive/ionNavView/를 참조하십시오.
AlexMart의 답변과 링크에 이어 다음과 같은 내용이 제공됩니다.
.controller('MyCtrl', function($scope) {
$scope.$on('$ionicView.enter', function() {
// Code you want executed every time view is opened
console.log('Opened!')
})
})
뷰에 특정 컨트롤러를 할당한 경우 뷰가 로드될 때마다 컨트롤러가 호출됩니다.이 경우 다음과 같이 컨트롤러에서 일부 코드를 호출 즉시 실행할 수 있습니다.
<ion-nav-view ng-controller="indexController" name="other" ng-init="doSomething()"></ion-nav-view>
또한 컨트롤러:
app.controller('indexController', function($scope) {
/*
Write some code directly over here without any function,
and it will be executed every time your view loads.
Something like this:
*/
$scope.xyz = 1;
});
편집: 루트가 변경되어 특정 루트가 방문되었을 때 상태 변경을 추적한 후 일부 코드를 실행할 수 있습니다.다음은 예를 제시하겠습니다.
$rootScope.$on('$stateChangeSuccess',
function(event, toState, toParams, fromState, fromParams){ ... })
자세한 내용은 State Change Events를 참조하십시오.
저는 같은 문제에 직면했고, 여기에서는 이 행동의 이유를 같은 문제를 가진 다른 모든 사람들에게 남깁니다.
라이프 사이클 표시
성능을 향상시키기 위해 뷰 요소 및 스코프 데이터를 캐시하는 Ionic의 기능을 개선했습니다.컨트롤러가 초기화되면 앱 수명 내내 지속될 수 있으며, 워치 사이클에서 숨겨지고 제거됩니다.스코프를 재구축하고 있지 않기 때문에 워치 사이클을 다시 시작할 때 들어야 할 이벤트를 추가했습니다.
자세한 설명과 $ionic View이벤트를 보려면 http://ionicframework.com/blog/navigating-the-changes/를 방문하십시오.
cache-view="false"를 사용하여 뷰 캐시를 해제해 보십시오.
ion-nav-view에 다음과 같이 추가합니다.
<ion-nav-view name="other" cache-view="false"></ion-nav-view>
또는 stateProvider:
$stateProvider.state('other', {
cache: false,
url : '/other',
templateUrl : 'templates/other/other.html'
})
어느 쪽이든 컨트롤러가 항상 호출됩니다.
예를 들어 @Michael Trouw에게,
이 코드를 입력해 주세요.이 상태가 시작되거나 활성화될 때마다 실행되므로 캐시를 비활성화할 염려가 없으므로 더 나은 방법입니다.
.controller('exampleCtrl',function($scope){
$scope.$on('$ionicView.enter', function(){
// Any thing you can think of
alert("This function just ran away");
});
})
뷰가 표시되기 전에 실행되는 $ionicView.beforeEnter ->와 같은 유연성의 예를 더 볼 수 있습니다.그리고 거기에는 더 많은 것들이 있다.
위에서 설명한 뷰 요소와 스코프 데이터를 캐시하는 Ionic의 기능을 고려하면 뷰가 로드될 때마다 컨트롤러를 실행하는 것도 하나의 방법입니다.ionic에서 사용되는 캐싱 메커니즘을 글로벌하게 디세블로 만들려면 다음 절차를 수행합니다.
$ionicConfigProvider.views.maxCache(0);
그렇지 않으면, 내가 할 수 있는 방법은
$scope.$on("$ionicView.afterLeave", function () {
$ionicHistory.clearCache();
});
이는 다시 들어갈 때마다 보기를 종료하고 컨트롤러를 다시 실행하기 전에 캐시를 클리어하기 위한 것입니다.
이것은 아마 당신이 찾고 있던 것입니다.
Ionic은 뷰와 컨트롤러를 캐시합니다.기본값(최대 10) http://ionicframework.com/docs/api/directive/ionView/
컨트롤러가 이러한 이온 이벤트를 기반으로 특정 작업을 수행할 수 있도록 연결할 수 있는 이벤트가 있습니다.예에 대해서는, http://ionicframework.com/blog/navigating-the-changes/ 를 참조해 주세요.
카메라 탭을 선택하자마자 네이티브 카메라를 로딩하려고 할 때 ionic에서도 비슷한 문제가 있었습니다.camera 탭의 ion-view 컴포넌트(tabs.html)에 컨트롤러를 설정하고 카메라를 로드하는 $scope 메서드(add Image)를 호출하여 문제를 해결했습니다.
www/templates/tabs.html 내
<ion-tab title="Camera" icon-off="ion-camera" icon-on="ion-camera" href="#/tab/chats" ng-controller="AddMediaCtrl" ng-click="addImage()">
<ion-nav-view name="tab-chats"></ion-nav-view>
</ion-tab>
AddMediaCtrl에서 정의된 addImage 메서드는 사용자가 "카메라" 탭을 클릭할 때마다 네이티브 카메라를 로드합니다.각도 캐시의 아무것도 변경하지 않아도 동작합니다.이게 도움이 됐으면 좋겠어요.
언급URL : https://stackoverflow.com/questions/27058276/run-a-controller-function-whenever-a-view-is-opened-shown
'code' 카테고리의 다른 글
Python에서 JSON으로 일련화가 10진수로 실패함 (0) | 2023.02.08 |
---|---|
각도 UI 라우터: 상태에 대한 액세스를 방지하는 방법 (0) | 2023.02.08 |
일부 알려진 필드 이름과 일부 알려지지 않은 필드 이름을 가진 JSON의 마셜 해제 (0) | 2023.02.08 |
Jackson이 JSON에 매핑하고 있는 개체의 일부 필드를 숨깁니다. (0) | 2023.02.08 |
RestSharp JSON 파라미터 게시 (0) | 2023.02.08 |