不使用页面刷新自动获取编辑数据

Question

我在数据库中插入数据的内容最初是进入ngOninit的。在这里，我试图在不刷新页面的情况下获取已编辑的数据，但是我面临的一个问题是更新的数据会附加到我以前获取的数据之后。

我需要的是我要显示的哪些数据更新。我不想再次显示以前的数据。我在下面显示我的浏览器图像，在那上面，我更新了手机而不是手机。数据正在获取，但它也会显示我以前的数据。

任何人都可以帮忙。

我的TS文件

 ngOnInit() {
          this.getting_category();
    }

getting_category(){
this.accountService.get_Category().subscribe(response=>{
  this.get_cat=response;
  for(var i=0;i<this.get_cat.length;i++){
    this.cat_name.push(this.get_cat[i].category_name);
  }
  for(var i=0;i<this.get_cat.length;i++){
    this.cat_id.push(this.get_cat[i]._id);
  }
  })
}


    /////Update Category/////
    cat_update(){
  let data={
  id:this.catdata[0]._id,
  category_name:this.category_name
  }
  this.accountService.updatecategory(data).subscribe(response=>{

    // this.Tmp=0;
    this.cat_name.clear();
this.getting_category();
alert("successfully updated")
  } ,err=>{
  alert("Something went wrong while update");
  })
  }

我的HTML

<div *ngIf="Tmp==0 else noTmp">
            <select   multiple id="sel1" name="category" (change)="change_fun($event)"  [(ngModel)]="catname" class="form-control">
                <option *ngFor="let x of cat_name" [value]="x">{{x}}</option>
            </select>
            <ng-template #noTmp>
                    <select   multiple id="sel1" name="category" (change)="change_fun($event)"  [(ngModel)]="catname" class="form-control">
                            <option *ngFor="let x of cat_name" [value]="x">{{x}}</option>
                        </select>
            </ng-template>
        </div>

我的服务

updatecategory(data):Observable<any>{
    return (this.http.post(this.apiPath + 'user/updatecategory', data).pipe(map(this.dt)));
    }

Answer 1

我不知道这是哪种编程语言，但是当我们使用ajax加载数据时，我们使用js中的empty（）方法清空了该下拉列表的数据，然后追加了新数据

Answer 2

在将数据放入其中之前，您应该先呼叫 this.cat_name.clear（）; 。

this.accountService.get_Category().subscribe(
this.get_cat=response;
this.cat_name.clear() // clear list before loading data 
for(var i=0;i<this.get_cat.length;i++){
   this.cat_name.push(this.get_cat[i].category_name);
}