Angular 9 listen to form pristine change

Question

I want to listen to the first change by the user in a form, what I need is something like this:

$rootScope.$watch(function() {
            return validationForm.$pristine;
        }, function(newVal, oldVal) {

but in angular 9.

I tried using valueChanges

this.form.valueChanges.subscribe((result) => { })

but it emit on each change in the form build too. how can I subscribe only to the first user's change?

Answer 1

You could use an RxJS pipe like first or take and subscribe to that.

For example:

this.form.valueChanges.pipe(first()).subscribe((result) => { })

or if you wanted to listen to the first 5 changes you could do this:

this.form.valueChanges.pipe(take(5)).subscribe((result) => { })

In case what you're trying to do is validation related you may want to look at status change instead. This answer gives a very short explanation

Adding a minimal stackblitz example of what I understand you are trying to achieve