CODEWITHSUNDEEP
javascripthtmlangulartypescript
Grim Stone
Grim Stone

Reputation: 95

Angular Typerror

I keep getting the error below in my code where I am trying to display a newly edited and saved text after refreshing the page. I initialized the variable, made the access variable public but nothing worked. What am I missing here?

HTML:

<p>
                <span contenteditable [textContent]="_stickerData?.StickerData" (input)="onStickerDataChange($event.target.innerHTML)">
                    {{_stickerData?.StickerData}}
                </span>
            </p>          
        </div>
        <div fxLayout="row" fxLayoutAlign="start center">
            <button mat-button matRipple class="purple-500 fuse-white-fg mr-12" (click)="save()"> Etiket Güncelle </button>
        </div>

TS:

public_stickerData: IStickerData = {};
Filter: IFilter = {};

@Input()
  set StickerData(prm: IStickerData) {
      if (this._stickerData != prm) {
          this._stickerData = prm;
      }
  }
  get StickerData(): IStickerData {
      return this._stickerData;
  }

 ngOnInit() {
    this._productionService.getStickerDataList(this.Filter)
    .subscribe((response: any) => this._stickerData.StickerData = response);
    
  }


 onStickerDataChange(data) {
    this._stickerData.StickerData = data;
}
save(){
    this.confirmDialogRef = this._dialog.open(FuseConfirmDialogComponent, {
        disableClose: false,
    });
    
    this.confirmDialogRef.componentInstance.confirmMessage =
    "Etiket bilgileri değiştirilecektir, emin misiniz?";

this.confirmDialogRef.afterClosed().subscribe((result) => {
    if (result) {
        this._productionService
            .saveStickerData(this._stickerData)
            .subscribe((response: IStickerData) => {
                this._stickerData = response;
                this._messages.Show(
                    "Etiket güncellendi",
                    "BAŞARILI",
                    3
    

        );
            this.cd.markForCheck();
        });
}
});

}

Service TS:

getStickerDataList(data: IFilter): Observable<IStickerData[]> {
        return this._http.post("Production/GetStickerDataList", data);
    }

Upvotes: 1

Views: 49

Answers (1)

Abhinav Kumar
Abhinav Kumar

Reputation: 3036

No need to access one more deep level of the object, It is available by default as private instance. this Itself represent the class instance. You can directly access this._stickerData

ngOnInit() {
    this._productionService.getStickerDataList(this.Filter)
    .subscribe((response: any) => this._stickerData = response); // no need to use this._stickerData.StickerData
  }

Also make sure you are getting the data in the return.

Upvotes: 1

Related Questions