Chạy chức năng bộ điều khiển bất cứ khi nào một dạng xem được mở / hiển thị

Tôi đang xây dựng một ứng dụng với góc + ion sử dụng menu ba nút cổ điển ở dưới cùng với ba tab ion trong đó. Khi người dùng nhấp vào một tab, mẫu đó sẽ mở qua ui-router.

Tôi có các trạng thái như thế này:

$stateProvider
  .state('other', {
    url: "/other",
    abstract: true,
    templateUrl: "templates/other/other.html"
})

Trong mẫu, tôi làm một cái gì đó như:

<ion-nav-view name="other" ng-init="doSomething()"></ion-nav-view>

Tôi biết rằng tôi có thể viết hàm doSomething () trong bộ điều khiển của mình và chỉ cần gọi nó theo cách thủ công ở đó. Điều đó mang lại cho tôi cùng một vấn đề. Tôi dường như không thể tìm ra cách gọi hàm doSomething () nhiều lần, bất cứ khi nào ai đó mở chế độ xem đó.

Ngay bây giờ, hàm doSomething () được gọi tốt, nhưng chỉ lần đầu tiên người dùng mở chế độ xem / tab đó. Tôi muốn gọi một hàm (để cập nhật vị trí địa lý) bất cứ khi nào người dùng mở chế độ xem hoặc tab đó.

Một cách đúng đắn để thực hiện điều đó là gì?

Cảm ơn vì đã giúp đỡ!

Nếu bạn đã gán một bộ điều khiển nhất định cho chế độ xem của mình, thì bộ điều khiển của bạn sẽ được gọi mỗi khi chế độ xem của bạn tải. Trong trường hợp đó, bạn có thể thực thi một số mã trong bộ điều khiển của mình ngay khi nó được gọi, ví dụ như theo cách này:

<ion-nav-view ng-controller="indexController" name="other" ng-init="doSomething()"></ion-nav-view>

Và trong bộ điều khiển của bạn:

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;
});

Chỉnh sửa: Bạn có thể cố gắng theo dõi các thay đổi trạng thái và sau đó thực thi một số mã khi tuyến đường được thay đổi và một tuyến đường nhất định được truy cập, ví dụ:

$rootScope.$on('$stateChangeSuccess', 
function(event, toState, toParams, fromState, fromParams){ ... })

Bạn có thể tìm thêm thông tin chi tiết tại đây: Sự kiện Thay đổi Bang .

Theo mặc định, bộ điều khiển của bạn là bộ nhớ cache và đó là lý do tại sao bộ điều khiển của bạn chỉ kích hoạt một lần. Để tắt bộ nhớ đệm cho một bộ điều khiển nhất định, bạn phải sửa đổi .config(..).statevà đặt cachetùy chọn thành false. ví dụ :

  .state('myApp', {
    cache: false,
    url: "/form",
    views: {
      'menuContent': {
        templateUrl: "templates/form.html",
        controller: 'formCtrl'
      }
    }
  })

để đọc thêm, vui lòng truy cập http://ionicframework.com/docs/api/directive/ionNavView/

Theo dõi câu trả lời và liên kết từ AlexMart , một cái gì đó như thế này hoạt động:

.controller('MyCtrl', function($scope) {
  $scope.$on('$ionicView.enter', function() {
     // Code you want executed every time view is opened
     console.log('Opened!')
  })
})

Tôi đã đối mặt với cùng một vấn đề và ở đây tôi để lại lý do của hành vi này cho những người khác có cùng vấn đề.

Xem vòng đời

Để cải thiện hiệu suất, chúng tôi đã cải thiện khả năng của Ionic để lưu vào bộ nhớ cache của các phần tử xem và dữ liệu phạm vi. Khi bộ điều khiển được khởi chạy, nó có thể tồn tại trong suốt vòng đời của ứng dụng; nó chỉ bị ẩn và bị xóa khỏi chu kỳ theo dõi. Vì chúng tôi không xây dựng lại phạm vi, chúng tôi đã thêm các sự kiện mà chúng tôi nên lắng nghe khi vào lại chu kỳ xem.

Để xem mô tả đầy đủ và các sự kiện $ ionicView, hãy truy cập: http://ionicframework.com/blog/navicting-the-changes/

Tại sao bạn không tắt bộ nhớ cache của chế độ xem bằng cache-view = "false" ?

Theo quan điểm của bạn, hãy thêm cái này vào chế độ xem ion-nav như thế:

<ion-nav-view name="other" cache-view="false"></ion-nav-view>

Hoặc trong trạng thái của bạnProvider:

$stateProvider.state('other', {
   cache: false,
   url : '/other',
   templateUrl : 'templates/other/other.html'
})

Một trong hai sẽ làm cho bộ điều khiển của bạn luôn được gọi.

Ví dụ với @Michael Trouw,

bên trong bộ điều khiển của bạn đặt mã này. điều này sẽ chạy mọi lúc khi trạng thái này được nhập hoặc hoạt động, bạn không cần phải lo lắng về việc tắt bộ nhớ cache và đó là một cách tiếp cận tốt hơn.

.controller('exampleCtrl',function($scope){
$scope.$on('$ionicView.enter', function(){
        // Any thing you can think of
        alert("This function just ran away");   
    });
})

Bạn có thể có thêm ví dụ về tính linh hoạt như $ ionicView.beforeEnter -> chạy trước khi một chế độ xem được hiển thị. Và còn một số nữa về nó.

Xem xét khả năng của Ionic để lưu vào bộ nhớ cache các phần tử và dữ liệu phạm vi được đề cập ở trên, đây có thể là một cách làm khác, nếu bạn muốn chạy bộ điều khiển mỗi khi chế độ xem được tải. Bạn có thể vô hiệu hóa toàn cầu cơ chế bộ nhớ đệm được sử dụng bởi ionic bằng cách:

$ionicConfigProvider.views.maxCache(0);

Mặt khác, cách tôi làm cho nó hoạt động với tôi

$scope.$on("$ionicView.afterLeave", function () {
     $ionicHistory.clearCache();
}); 

Điều này là để xóa bộ nhớ cache trước khi rời khỏi chế độ xem để chạy lại bộ điều khiển mỗi khi bạn vào lại.

Đây có thể là những gì bạn đang tìm kiếm:

Ionic lưu trữ các chế độ xem của bạn và do đó bộ điều khiển của bạn theo mặc định (tối đa là 10) http://ionicframework.com/docs/api/directive/ionView/

Có những sự kiện bạn có thể tham gia để cho phép bộ điều khiển của bạn thực hiện một số việc dựa trên các sự kiện ion đó. xem ví dụ ở đây: http://ionicframework.com/blog/navicting-the-changes/

Tôi đã gặp sự cố tương tự với ionic trong đó tôi đang cố gắng tải máy ảnh gốc ngay khi tôi chọn tab máy ảnh. Tôi đã giải quyết vấn đề bằng cách đặt bộ điều khiển thành thành phần ion-view cho tab máy ảnh (trong tabs.html), sau đó gọi phương thức $ scope tải máy ảnh của tôi (addImage).

Trong www / template / 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>

Phương thức addImage, được định nghĩa trong AddMediaCtrl tải máy ảnh gốc mỗi khi người dùng nhấp vào tab "Máy ảnh". Tôi không phải thay đổi bất cứ điều gì trong bộ nhớ cache góc để điều này hoạt động. Tôi hi vọng cái này giúp được.