I'm attempting to update a Subject named period by calling .next() with a new string, but the console is showing an error saying this.period.next is not a function.
option.component.ts
import { Component, OnInit } from '@angular/core';
import { Subject } from 'rxjs';
@Component({
selector: 'app-option',
templateUrl: './option.component.html'
})
export class OptionComponent implements OnInit {
public period: Subject<string> = new Subject<string>();
constructor() {}
ngOnInit() {}
setPeriod(period: string) {
this.period.next(period);
}
}
option.component.html
<mat-radio-group [(ngModel)]="period" (ngModelChange)="setPeriod($event)">
<span *ngFor="let option of httpHeader.option"><mat-radio-button [checked]="option.default" [value]="option.param" >{{ option.desc }}</mat-radio-button><br /></span>
</mat-radio-group>
I am using rxjs 5.5.2. The setPeriod function is called upon selecting a radio button.
What could be causing this issue? Using the same method in an HTTP service works fine, but it's not working within this component.