From the course: Building Angular and Django Apps

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Displaying more information with Angular

Displaying more information with Angular

From the course: Building Angular and Django Apps

Start my 1-month free trial

Displaying more information with Angular

- [Instructor] We're going to create the tour length filter by using the chip components from Angular material. Start with a div, and we have tour length to filter by. And then we use the mat chip list component, and within it, we use a mat chip. We bind selected to the value of the tour length, and we bind the click event so that when we click on this one, it will display all tours that are available. And then, we're going to define a mat chip that's only selected when the tour length is equal to one. And when we click on this one, it will filter by a tour length of one. We're going to do the same for filtering by a tour length of two, and three days. In the component code, we have to define the tour length variable. And it starts off as null, which means all packages should show up and then, we define the filter by tour length method that we were calling whenever a mat chip was clicked. So we…

Contents