When the "view detail" link is clicked, I wanted to open a modal for a detailed view of a specific user. However, I encountered an issue where I couldn't retrieve the user ID in the resolve attribute of $uibModal.open(). Strangely enough, the ID is available in the inline controller function.
.state('dashboard.users',{
url:'/users',
cache:false,
views:{
'listusers':{templateUrl:'./partials/users/list.tpl.html?time='+ Math.random(),controller:'UsersController'}
},
authenticate:true
})
.state('dashboard.users.view',{
url:'/view/:id',
parent:'dashboard.users',
cache:false,
authenticate:true,
onEnter:['$uibModal',function ($uibModal) {
$uibModal.open({
templateUrl:'./partials/users/view.tpl.html',
keyboard:false,backdrop:'static',
size:'sm',
resolve:{
userData: function($stateParams, $state) {
console.log($stateParams.id);// unable to get id
}
},
controller:function($scope,$uibModalInstance,$state,UsersFactory,userData,$stateParams){
$scope.closeLoginModal=function(){
$uibModalInstance.dismiss('cancel');
$state.go('dashboard.users');
}
console.log($stateParams.id); // id is avaliable over here
}
});
}]
});
HTML
<tr ng-repeat="i in users">
<td>{{ i.id }}</td>
<td>{{ i.name }}</td>
<td>{{ i.email }}</td>
<td>{{ i.username }}</td>
<td>{{ i.website }}</td>
<td><a ui-sref="dashboard.users.view({id:i.id})"><button class="btn btn-default btn-xs">View</button></a></td>
</tr>
Any assistance on what may be going wrong in my implementation would be greatly appreciated.