Data not refreshing in mat-autocomplete

Viewed 504

On init, I called a method (loadCategories) to get some data that I used in my mat-autocomplete, but when the data got updated and after recalling the (loadCategories) method the mat-autocomplete didn't update too, so unless I refresh the tab the mat-autocomplete values stays the same even if a category got added or updated.

this is my current code :

async ngOnInit() {
    await this.loadCategories();

    this.filteredOptions = this.myControl
                            .valueChanges
                            .pipe(
                              startWith(''),
                              map(value => this._filterGroup(value))
                            )
}


  addSubmit(){
    this.catgService.addCatgory(this.newCategory).subscribe(
      async data =>{
        this.successAdd = true
        this.all_categories = []
        await this.loadCategories();
        console.log(this.all_categories);

        this.errorMessage = "Sous categorie ajouter avec succes"
      },
      error=>{
        this.successAdd = false
        this.errorMessage = error.error.message
      }
    )
  }

on the html side I did:

                <mat-form-field style="width: 100%;">
                    <input type="text" id="catg" placeholder="Choisir une catégorie" matInput [matAutocomplete]="autoGroup" [formControl]="myControl" [(ngModel)]="value">
                    <mat-autocomplete #autoGroup="matAutocomplete" (optionSelected)='parentSelected($event.option.value)' [displayWith]="displayFn">
                        <mat-option *ngFor="let parent of filteredOptions | async" [value]="parent.category">
                        {{parent.category.name}}
                        </mat-option>
                    </mat-autocomplete>
                    <button type="button" mat-button  style="background: transparent;border: none;" *ngIf="value" matSuffix mat-icon-button aria-label="Clear" (click)="value = ''">
                        <mat-icon>close</mat-icon>
                    </button>
                </mat-form-field>
0 Answers
Related