0

I have 2 components .first one is a students attendance form listing the students along with check boxes .Unchecked students are absent .On submit of the students attendance form i have to go to another component and show the absent students only .I tried communication methods but all of them needs both components to be displayed together.I need to go from one to another and display data from first in second. Please help me.

My data is an array (name1,name2,name3).

Ragisha
  • 1
  • 2

1 Answers1

3

You can use:

  1. Services with setter and getter methods (Data will be lost if you refresh)
  2. Local Storage (Data will be saved in your browser's local storage)
  3. Any state management container like mobx, redux
Kars Barendrecht
  • 549
  • 10
  • 23
Sreekar Sree
  • 404
  • 5
  • 14
  • will the data be lost on navigation to 2nd component – Ragisha Apr 18 '18 at 06:08
  • Nope data will not be lost during navigation.. Only when u refresh your page it will be lost. If you don't have huge amount of data and data for which security is not a concern then you can use localStorage else go for services or any state management container. If you are a beginner I'll prefer service with setters and getters – Sreekar Sree Apr 18 '18 at 06:09
  • yeah as @SreekarSree mentioned you can use a service to overcome this problem. There is a nice exmample on [angular official documentaion](https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service). Just take a look. – Anuradha Gunasekara Apr 18 '18 at 06:11
  • A service as a single point of truth for your state is a good idea, especially when you need the state in multiple views (e.g. navigating with Angular router). You can even extend the service to store the data to the browser's localStorage and restore from there during initialization, if you need to cover the reload scenario. – Georg Wittberger Apr 18 '18 at 06:15