Last active
January 29, 2025 15:46
Minimal example of effect
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* eslint-disable max-classes-per-file */ | |
/* eslint-disable @angular-eslint/component-selector */ | |
import { | |
ChangeDetectionStrategy, | |
Component, | |
effect, | |
inject, | |
Injectable, | |
OnInit, | |
signal, | |
WritableSignal, | |
} from '@angular/core'; | |
@Injectable({ | |
providedIn: 'root', | |
}) | |
export class ServiceOne { | |
public signalOne$ = signal(1); | |
} | |
@Injectable({ | |
providedIn: 'root', | |
}) | |
export class ServiceTwo { | |
public signalTwo$ = signal(2); | |
private readonly serviceOne = inject(ServiceOne); | |
public updateSignalTwo(): void { | |
this.signalTwo$.update((value) => { | |
return value + this.serviceOne.signalOne$(); | |
}); | |
} | |
} | |
@Component({ | |
selector: 'my-component', | |
changeDetection: ChangeDetectionStrategy.OnPush, | |
template: '', | |
standalone: true, | |
}) | |
export class MyComponent implements OnInit { | |
public signalTwo$!: WritableSignal<number>; | |
private readonly serviceTwo = inject(ServiceTwo); | |
public constructor() { | |
effect(() => { | |
// / I want to spy on `updateSignalOne` and make sure it gets called when I update someSignalTwo$, which depends on someSignalOne$, but doesn't come from a service that is being injected into this component! | |
this.serviceTwo.updateSignalTwo(); | |
}); | |
} | |
public ngOnInit(): void { | |
this.signalTwo$ = this.serviceTwo.signalTwo$; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Working test using ng-mocks