Sử dụng phạm vi $ trong ui-router giải quyết

Question

Tôi đang sử dụng giải pháp ui-router để nhận một số dữ liệu từ một dịch vụ.

Vấn đề là tôi cần lấy giá trị từ phạm vi $ parent để gọi dịch vụ như được hiển thị bên dưới.

resolve: { 
       contactService: 'contactService', 
       contacts: function ($scope, contactService) { 
        return contactService.getContacts($scope.parentCtrl.parentObjectId); 
       } 
      } 

tôi tiếp tục nhận được Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!

Cũng thử một vài nỗ lực tuyệt vọng chẳng hạn như thêm phạm vi cho các đối tượng quyết tâm như thể hiện dưới đây với không thành công.

scope: $scope 

Bất kỳ ý tưởng nào?

Answer 1

Điều đó là không thể, phạm vi chưa được khởi tạo tại thời điểm đó nên bạn không thể sử dụng nó trong đối tượng giải quyết. Bạn có thể truy cập phạm vi trong bộ điều khiển sau khi nó được khởi tạo. Toàn bộ điểm giải quyết là nó chạy trước khi khởi động bộ điều khiển để bạn có thể tiêm và truy cập trực tiếp vào các mục được giải quyết trong phạm vi của mình.

Nếu bạn cần chuyển biến sang trạng thái tiếp theo, bạn có thể thực hiện điều đó bằng cách sử dụng đối tượng $stateParams có sẵn để sử dụng trong giải quyết. Bạn có thể thêm dữ liệu vào nó khi thay đổi trạng thái, ví dụ:

Trong mẫu của bạn, nếu bạn có một ObjectId trong phạm vi của bạn:

<a ui-sref="statename({'id': objectId})">Change states</a> 

Hoặc trong điều khiển của bạn:

$scope.go('statename', {'id': $scope.objectId}); 

Bạn có thể sau đó truy xuất thông tin đó trong quyết tâm của bạn bằng cách sử dụng số $stateParams:

resolve: { 
    contactService: 'contactService', 
    contacts: function ($stateParams, contactService) { 
     return contactService.getContacts($stateParams.id); 
    } 
} 

Answer 2

Làm phương án thay thế e với giải pháp được chấp nhận, yêu cầu một chuyến đi khứ hồi khác tới máy chủ cho cùng một tài nguyên (nếu bạn nhận được giá trị từ máy chủ/api), bạn có thể $watch cha mẹ từ bộ điều khiển con.

function ParentController($http) { 
    var vm = this; 
    $http.get(someResourceUrl).then(function(res) { 
    vm.someResource = res.data; 
    }); 
} 

function ChildController($scope) { 
    // wait untill the parent gets the value 
    var unwatch = $scope.$watch('parent.someResource', function(newValue) { 
    if (newValue) { 
     // the parent has the value, init this controller 
     init(newValue); 
     // dispose of the watcher we no longer need 
     unwatch(); 
    } 
    }); 
    function init(someResource) { 
    // ... do something 
    } 
} 

function routerConfig($stateProvider) { 
    $stateProvider 
    .state('parent', { 
     url: '/parent', 
     controller: 'ParentController', 
     controllerAs: 'parent', 
     templateUrl: '...', 
    }) 
    .state('parent.child', { 
     url: '/child', 
     controller: 'ChildController', 
     controllerAs: 'child', 
     templateUrl: '...', 
    }); 
}