TypeError：无法读取 Object.stop anguar 5 处未定义的属性“UpdateXY”

Posted 2023-05-07

【中文标题】TypeError：无法读取 Object.stop anguar 5 处未定义的属性“UpdateXY”

【英文标题】：TypeError: Cannot read property 'UpdateXY' of undefined at Object.stop anguar 5

【发布时间】：2018-10-19 04:38:44

【问题描述】：

我有一个 HomeComponent：

@Component(
  selector: 'gridster-general',
  templateUrl: './home.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
  encapsulation: ViewEncapsulation.None
)

这是导出类，它包含 gridster 仪表板的初始化：

export class HomeComponent implements OnInit 

  options: GridsterConfig;
  dashboard: Array<GridsterItem>;
  widget:any;

  constructor(private dataService:DataService ) 
   

  ngOnInit() 
    this.options = 
      gridType: GridType.ScrollVertical,
      compactType: CompactType.None,
      margin:10,
      outerMargin: true,
      outerMarginTop: null,
      outerMarginRight: null,
      outerMarginBottom: null,
      outerMarginLeft: null,
      mobileBreakpoint: 640,
      minCols: 1,
      maxCols: 10,
      minRows: 1,
      maxRows: 100,
      maxItemCols: 100,
      minItemCols: 1,
      maxItemRows: 100,
      minItemRows: 1,
      maxItemArea: 2500,
      minItemArea: 1,
      defaultItemCols: 1,
      defaultItemRows: 1,
      fixedColWidth: 105,
      fixedRowHeight: 105,
      keepFixedHeightInMobile: false,
      keepFixedWidthInMobile: false,
      scrollSensitivity: 10,
      scrollSpeed: 20,
      enableEmptyCellClick: false,
      enableEmptyCellContextMenu: false,
      enableEmptyCellDrop: false,
      enableEmptyCellDrag: false,
      emptyCellDragMaxCols: 50,
      emptyCellDragMaxRows: 50,
      ignoreMarginInRow: false,
      draggable: 
        enabled: true,     
        stop:
        function (event, $element, widget) 

          this.widget = 
            x:$element.$item.x,
            y:$element.$item.y
          
          HomeComponent.prototype.dataService.UpdateXY(this.widget);
        

      ,...

我使用了HomeComponent.prototype，因为我无法使用this.dataService 访问dataService 变量

我正在尝试获取小部件在 angular 5 gridster 中的位置并将其保存在我的数据库中。 数据服务是与我的数据库交互的服务，UpdateXY() 是一个使用 post 方法将信息保存在数据库中的函数。 我收到此错误：

ERROR TypeError: Cannot read property 'UpdateXY' of undefined
    at Object.stop (home.component.ts:106)
    at GridsterDraggable.dragStop (gridsterDraggable.service.ts:158)
    at HTMLDocument.eval (platform-browser.js:2628)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4751)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at ZoneTask.invokeTask [as invoke] (zone.js:496)
    at invokeTask (zone.js:1540)
    at HTMLDocument.globalZoneAwareCallback (zone.js:1566)

谁能帮我解决这个问题

【问题讨论】：

行内内容：home.component.ts 的第 106 行？

HomeComponent.prototype.dataService.UpdateXY(this.widget);我认为问题在于从停止函数内部调用数据服务，当我从外部调用它时，就像在 onInit() 中它工作正常

分享更多代码。我在您的代码中看不到registerUser。难以调试

对不起，我分享了错误的错误，它是 UpdateXY() 而不是 RegisterUser

你为什么要以这种方式调用服务HomeComponent.prototype.dataService. ??分享什么更好的代码，否则你不会在这里得到解决方案。请查看 SO 规则

【参考方案1】：

解决了，而不是 ;

stop:
        function (event, $element, widget) 

          this.widget = 
            x:$element.$item.x,
            y:$element.$item.y
          
          HomeComponent.prototype.dataService.UpdateXY(this.widget);
        

正确的格式是：

 stop: (event, $element, widget) => 

          this.widget = 
            x:$element.$item.x,
            y:$element.$item.y
          
       this.dataService.UpdateXY(this.widget);