I'm a bit confused about my problem. In fact I've 2 views and ctrl who are working with a service. First View contains a tablelist with the items which will load from a WebAPI. The service makes requests to the server and provides to order. Also I'm using another service to transfer the selected item row in the other Ctrl. Here's the Code:
View1:
//view1.html
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in namelist" ng-click="open(this.item)">
<td>{{ item.fname }}</td>
<td>{{ item.lname }}</td>
</tr>
</tbody>
</table>
Ctrl1:
//FirstCtrl
$scope.namelist = reqService.names.query();
$scope.open = function (item) {
$scope.selectedItem = item;
modalService.openDialog($scope.namelist, $scope.selectedItem);
}
HTTP-Service:
//Service for HTTP Requests
testApp.factory('reqService', ['$resource', 'baseUrl', function ($resource, baseUrl) {
return {
names: $resource(baseUrl + '/api/name/:Id', {
Id: '@Id'
}, {
'update': {
method: 'PUT'
}
})
}
}]);
Service for modal dialog:
//Modal dialog service
testApp.factory('modalService', ['$modal', function ($modal) {
return {
openDialog: function (namelist, selectedItem) {
return $modal.open({
templateUrl: 'views/view2.html',
controller: 'SecondCtrl',
resolve: {
namedList: function () {
return namelist;
},
selected: function () {
return selectedItem;
}
}
});
}
}
}]);
Ctrl2:
testApp.controller('SecondCtrl', ['$scope', '$modalInstance', 'namedList', 'selected', 'reqService', '$http'..., function (...){
/*copy of the original items*/
$scope.copyItem = angular.copy(selected);
$scope.cancel = function () {
$scope.selected = angular.copy($scope.copyItem);
$modalInstance.dismiss('cancel');
}
$scope.reset = function () {
$scope.selected = angular.copy($scope.copyItem);
selected = angular.copy($scope.copyItem); //doesn't work
}
}
My question is how can I reset the tablelist? When I click on resetBtn, it resets only the form in my modal window but the changes remain in the table list?! I cannot reset the resolve variable "selected".
It could be a case pass by value|reference.
Read this Is JavaScript a pass-by-reference or pass-by-value language? .
It would be interesting to see how it works if you try to pass a function that reset the value instead.
One possible implementation
Ctrl1:
Ctrl2 began :
Ok I know it's dirty but it's just to test the assumption.