@UrbanCondor wrote:
I'm having trouble with an Ionic 2 App I am working on - It appears as though it's a caching issue, but I can't figure out why it is occurring. I think perhaps the navParam data I am pushing to a page is persisting when I pop the page off again? Below is a detailed explanation of what I'm experiencing - I would appreciate any input / advice / code critiques.
GroceryApp
The GroceryApp consists of the following components:
* HomePage - Lists Grocery Stores. Enables a user to delete existing stores.
* DetailsPage - Acts as the "Create Grocery Store" and "Edit Grocery Store" page, depending on how the user navigated to the page. Enables a user to Enter / Modify Grocery Store Information, and also to View / Delete from a list of store products (each store can have zero, one or more products).
* ProductModal - Acts as the "Create Grocery Store Product" and "Edit Grocery Store Product" modal, depending on how the user navigated to the modal. Enables the user to Enter / Modify Grocy Store Product Information.
* GroceryDataProvider - Contains all required details for syncing PouchDB to Cloudant. I based this on the provider found in this tutorial, except it uses cloudant instead of CouchDB.Sample Screenshots
Database Structure
I'm using a very basic JSON document structure:
{
"_id": "471B10E6-2F4E-3663-8765-44176EAD5343",
"_rev": "1-7fcd259cb670ef3457278ec1b42c5574",
"g_store_name": "Store A",
"g_store_description": "A very nice store",
"g_store_products": [
{
"product_id": "0",
"product_name": "Apple",
"product_description": "Crispy",
"product_price": "100"
},
{
"product_id": "1",
"product_name": "Banana",
"product_description": "Ripe",
"product_price": "150"
},
{
"product_id": "2",
"product_name": "Pear",
"product_description": "Rotten",
"product_price": "50"
}
]
}The Issue
I'm having an issue maintaining and displaying the GroceryStoreProduct Array. When a user is on the DetailsPage, I want them to be able to add / edit / delete as many GroceryProducts as they wish, however I don't want anything to be saved to the database until they hit the SUMIT button. Also, if the user hits the CANCEL button then I want the GroceryStoreProduct Array to return to its original state before the user entered the DetailsPage, i.e. a reflection of what is written in the database.Everything works fine on SUBMIT. All new product are added to the database and any removed products are removed.
However, when the user hits CANCEL, I'm having no such luck. For example, if I Edit "Store A" and delete the "Banana" product, then click CANCEL, the HomePage is displayed however it lists "Store A" as having "Apple" & "Pear" products, but no "Banana". Opening the DetailsPage will reflect the same results, whereby only "Apple" & "Pear" products are listed. However checking the database will reveal that the "Banana" product still exists in the "Store A" g_store_products array.
I have been searching the Internet for clues as to what the problem may be, but no such luck yet. I thought maybe I needed to re-load the DB values using the ionViewLoaded function on the DetailsPage, but I can't work out how (or if I need to). Any input would be greatly appreciated.
The GroceryApp project can be found on GitHub here. You'll need to add your own cloudant connection information to the grocery-data.ts file to get it to work.
Posts: 1
Participants: 1