animal.component.ts

@Component({
    selector: 'app-animal',
    template: `
        <ng-container *ngFor="let animals of animals$ | async">
            <p>{{ animal }}</p>
        </ng-container>

        <input #inputAnimal placeholder='Add new animal' />

        <button (click)="addAnimal.emit(inputAnimal.value)">
          Add animal
        </button>
    `
})
export class CounterComponent {
    @Select(AnimalState) 
    public animals$: Observable<string[]>;

    @Emitter(AnimalState.addAnimal) 
    public addAnimal: Emittable<string>;
}