When I first enter the list view, all the edits work properly. Once I do an insert, then anytime I do an edit, the modal brings up the last inserted fields. Console.log debugging shows that $scope.item has been assigned properly but the modal does not show the correct $scope.item for the edit.
vm.openListItemModal = function (isEdit, item) {
if (isEdit) {
$scope.item = item;
}
else{
$scope.item = null;
}
console.log('vm.openListItemModal()', isEdit, $scope.item);
$scope.listItemModal.show();
}
If I go to another view and come back then the edit works fine again until I use the insert.
Any ideas would be appreciated as I have been debugging this for a few days now. Thanks.
more code⦠add to codePen maybe?
try this
if (isEdit) {
modal.item = item;
}
else{
modal.item = null;
}
$scope.listItemModal=modal;
$scope.listItemModal.show();
Thanks @snailred
By looking at your suggestion, I was able to come up with a solution. I will post it later for everyone to see.
After looking at the suggestion from @snailred, I played around and found a solution (see below).
//// ----- List Item Modal ----- ////
vm.upsertListItem = function(item) {
sharedListApi.upsertListItem(item).then(function(result){
vm.loadList(true);
// closing and cleaning up for modalListItem to avoid memory leaks
$scope.modalListItem.hide();
$scope.modalListItem.remove();
});
};
vm.openListItemModal = function (isEdit, item) {
// load the template for ionicModal
$ionicModal.fromTemplateUrl('app/_templates/modalListItem.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function(modal) {
if (isEdit) {
$scope.item = item;
}
else{
$scope.item = null;
}
$scope.modalListItem = modal;
$scope.modalListItem.show();
});
}
vm.closeListItemModal = function () {
$scope.modalListItem.hide();
$scope.modalListItem.remove();
}
Let me know if you have any questions. Hope this helps some of you guys.