AngularJS Architecture: Delete Bookmark

Lukas Ruebbelke
InstructorLukas Ruebbelke

Share this video with your friends

Send Tweet
Published 8 years ago
Updated 4 months ago

In this lesson, we are going to complete the functionality for deleting a bookmark. Deleting a bookmark is significantly easier than creating or editing a bookmark with the essence being a single method in the BookmarksModel that we make available to the controller and view.

[00:00] In this lesson, we are going to complete the functionality for deleting a bookmark from Eggly. This is going to be much simpler than when we were creating a bookmark, or specifically, editing a bookmark.

[00:15] This is really going to come down to a single method call in the bookmark's model, then wiring it up in the controller, and the template. In the bookmark's model, we are going to create a method called "Delete Bookmark," that takes a bookmarked object. From here, we are going to call a low dash method called "Remove."

[00:46] It just iterates over the bookmarks collection, compares the ID. If there is a match, then it will remove it from the bookmarks collection. I've said this before, but I will say this again. This is merely for illustration purposes. We are simulating a backend in memory, but for these purposes, it works and we can convey the point that we are trying to get across.

[01:17] If we go into the bookmarks controller here, we simply need to create a reference to the delete bookmark method on our controller. Then in our template, we'll just go up here and update this to point to the controller appropriately.

[01:43] Let's hop into the browser and see this in action. We'll refresh the page. Then if we click this delete button here, you can see that we are indeed removing these bookmarks from the bookmarks collection.

[01:57] This concludes our lesson on deleting a bookmark from the bookmarks collection. Stay tuned for the next lesson where I will show you how to animate state changes. See you soon.