从 ngOnInit 向函数传递值答案

【问题标题】：Passing Value to Functions From ngOnInit从 ngOnInit 向函数传递值
【发布时间】：2016-10-06 05:26:00
【问题描述】：

我有一个调用 clip 功能的按钮。我需要将值从 ngOnInit 传递给该函数，但我不能。我收到（例如）this.firstX 的未定义错误。如何将值从 ngOnInit 传递给函数？

export class AppAppComponent implements OnInit {

  public firstX: number;
  public firstY: number;
  public lastX: number;
  public lastY: number;

  constructor(mdIconRegistry: MdIconRegistry) {
    mdIconRegistry
      .registerFontClassAlias('fontawesome', 'fa');
  }

  ngOnInit() {

    let canvas = new fabric.Canvas('cLeft');
    let src = "../../images/kupurSecond.jpg";

    canvas.on('mouse:down', function (event) {
      var position = canvas.getPointer(event.e);
      this.firstX = position.x;
      this.firstY = position.y;
    });

    canvas.on('mouse:up', function (event) {
      var position = canvas.getPointer(event.e);
      this.lastX = position.x;
      this.lastY = position.y;
      // ReLoading Image
      loadImage(src, canvas, this.firstX, this.firstY, this.lastX, this.lastY);
    });

    loadImage(src, canvas);

  }; 

  public clip() {
    console.log(this.firstX);
  }

}

【问题讨论】：

标签： javascript angular typescript fabricjs ngoninit

【解决方案1】：

您必须使用箭头符号来保持相同的this 上下文。

canvas.on('mouse:down', (event) => {
      var position = canvas.getPointer(event.e);
      this.firstX = position.x;
      this.firstY = position.y;
});

mouse:up 函数也是如此。只是永远不要在打字稿中使用function这个词，你就是金子

【讨论】：