In my app, I have a form field that displays a list of options to choose from to the user. When I first enter the page, everything is fine and I can see the list. But if I go to another page and then go back to the page that has the form field, the options are no longer there. And the service that is supposed to display the options doesn't get called in the network. I don't understand why this happens. Here is my code, what should I do to fix this bug?

HTML:

<mat-form-field appearance="outline" fxFlex="100" fxFlex.gt-xs="30" class="w-100-p">                        
                    <mat-label>Receipt Group Type</mat-label>
                    <mat-select formControlName="ReceiptGroupType" 
                        [required]="form.value['StockType'] != 4">
                        <mat-option *ngFor="let prm of receiptGroupTypeList" [value]="prm.Id">
                            {{prm.Name}}
                        </mat-option>
                    </mat-select>
                </mat-form-field>

TS:

    set Product(prm: IProduct) {
        if (prm != this._product && prm != null) {
            this._product = prm;
        }
        if (this._product && this._product.ProductId > 0) {
            this.filterProductCategories = this.productCategories.filter(
                (x) =>
                    x.ProductGroup.ProductGroupId ==
                    this._product.ProductGroup.ProductGroupId
            );
            this.form = new FormGroup({
                ReceiptGroupType: new FormControl(
                    this._product.Receipt.ReceiptGroupType != null ? this._product.Receipt.ReceiptGroupType.Id:0
                ),
            });
        } else {
            this.form = new FormGroup({
                ReceiptGroupType: new FormControl(0),
            });
        }
    }
    get Product(): IProduct {
        return this._product;
    }
 constructor(
        private _adminService: AdminService,
    ) {
        let productId = this._activeRoute.snapshot.params["id"];

        this._adminService.getReceiptGroupList().then((response:IBasicModel[])=>{
            this.receiptGroupTypeList = response;
        });
    }

TS Service:

receiptGroupTypeList: IBasicModel[];
onReceiptGroupTypeListChanged: BehaviorSubject<any> = new BehaviorSubject(
    []
);
async getReceiptGroupList() {
    if (this.receiptGroupTypeList) {
        return undefined;
    }
    return await new Promise((resolve, reject) => {
        this._http
            .get("Parameter/GetReceiptGroupType")
            .subscribe((response: IBasicModel[]) => {
                this.receiptGroupTypeList = response;
                this.onReceiptGroupTypeListChanged.next(
                    this.receiptGroupTypeList
                );
                resolve(this.receiptGroupTypeList);
            }, reject);
    });
}