在打字稿中，创建具有HTTP构造函数的同一类的对象

Question

 export class FloorPlanComponent implements AfterViewInit, OnInit {
      constructor();
      constructor(public _baseComponentService?: BaseComponentService,
                  public _internalZoneService?: InternalZoneService,
                  public routeParams?: ActivatedRoute,
                  public internalAssetService?: InternalAssetService,
                  public slimLoadingBarService?: SlimLoadingBarService,
                  private errorLoggerService?: ErrorLoggerService
                 ) {
                     if (this._baseComponentService != null) {
                           this._baseComponentService.SetPageTitle("Zones - Internal");
                   }
      this.imgDelZone = parentElement.append("image")
        .attr("id", "delZone" + newId)
        .attr("idCounter", newId)
        .attr("r", "NaN")
        .attr("stroke-width", 0)
        .attr("opacity", 0.8)
        .attr("x", function (d) { return d.x + (shapeWidth - 22); })
        .attr("y", function (d) { return d.y + 1; })
        .attr("style", "opacity: 1; stroke-width: 1;")
        .attr("xlink:href", "../app/assets/images/Remove_Delete-22.png")
        .attr("preserveAspectRatio", "none")
        .attr("transform", " ")
        .attr("height", 18)
        .attr("width", 18)
        .attr("cursor", "pointer").on("click", function () {
            var comp = new FloorPlanComponent();
            comp.promptDeleteZone(this);
        });
}

在"单击"功能中，我想用它来引用我的类。但这将其称为窗口对象。为了解决此问题，我在无参数构造函数的帮助下创建了类的对象。但是据此，我无法获得任何服务。请帮助。

Answer 1

您可以使用箭头函数：

  attr("cursor", "pointer").on("click", () => {
    ...
  });

箭头功能捕获创建函数的 this，因此this将指向FloorPlanconmonponent实例。

Answer 2

怎么样

.attr("cursor", "pointer").on("click", this.onClicked.bind(this));
.............
onClicked() {
    var comp = new FloorPlanComponent();
    comp.promptDeleteZone(this);
}