Search⌘ K
AI Features

Solution #1: Modify the “Delete” Toast

Explore how to enhance user experience by modifying the delete toast notification in your Ionic and Angular app. Learn how to set the toast duration, add a close button, reposition it on the screen, and change its color, applying practical coding techniques to improve app feedback.

We'll cover the following...

Solution

import { AppPage } from './app.po';

describe('new App', () => {
  let page: AppPage;

  beforeEach(() => {
    page = new AppPage();
  });
  describe('default screen', () => {
    beforeEach(() => {
      page.navigateTo('/Inbox');
    });
    it('should say Inbox', () => {
      expect(page.getParagraphText()).toContain('Inbox');
    });
  });
});
Solution: Modify the “Delete” Toast

Explanation

Open up the Roster Page at src > app > roster > roster.page.ts. We have implemented the required changes on lines 89-97. Let’s take a look at each required change, ...