I am currently using a ui-router and I have a question regarding the resolve function. Is it possible to use resolve with the following state configuration:
state: {
url: "/summary",
templateUrl: '../script/planSummary.html',
controller: "summaryCtrl",params:{obj:null}
}
}
]
My issue is that I need to trigger an API call before the directive in my controller runs. The directive requires data from the API to populate the page.
Currently, when the page loads, the directive fires because it's called in HTML, and then the API is triggered afterwards. Can anyone provide guidance on how to use the $watch function or suggest an alternative approach to ensure that the API is triggered before the directive?
Here is a snippet of the API code (trimmed for readability):
$timeout(function () {$http({
method: 'GET',
url: 'getPSDetails?psuid='+$scope.psuId,
}).success(function (data) {
console.log('success response'); }
$scope.summaryObject =data; // This is where all the data is retrieved
And here is a snippet of my Directive code (also trimmed for clarity):
myapp.directive('summaryFeatureDetails',function(){
return{
restrict: 'E',
scope:true,
controller:function($scope){
$scope.columnPerPage = 5;
$scope.currentPage = 0;
$scope.currentColumns = [];
$scope.controlData = [];
$scope.totalNumberOfPage = Math.floor($scope.selectedData.length/$scope.columnPerPage);
if (($scope.selectedData.length % $scope.columnPerPage) > 0){
$scope.totalNumberOfPage = $scope.totalNumberOfPage + 1;
}
}
}