Question

我有一个名为tableIndexNumber的变量，需要在不同的方法内部使用。因此，当我尝试到达该变量时，可以使用“ this.tableIndexNumber”，并且可以到达它。但是由于htmlElemets在每个循环中也定义为“ this”，因此我无法在Jquery每个循环中以这种方式使用它。那么我应该遵循哪种方式？

export class TablesComponent implements OnInit {

tableIndexNumber = 1;

constructor() { }

change(col: number) {

$('#' + col).each(function () {

  if ($(this).attr('class') === 'box') {

    $(this).addClass('boxSelected');
    this.tableIndexNumber ++; 

  } else {
    $(this).removeClass('boxSelected').addClass('box');
  }
});

}

Answer 1

处理此问题的传统方法是将this保存到变量each之前的称为“上下文”或“ that”或类似名称的变量中，然后使用该变量。 ~~今天非常感谢您拥有arrow functions，由于它们没有自己的this上下文，因此非常适合这种情况。~~

更新：我忽略了查找each的语法。看来您需要内部this，所以箭头功能将不起作用。相反，您可以通过将外部this保存到变量来解决问题：

export class TablesComponent implements OnInit {
    tableIndexNumber = 1;

    constructor() { }

    change(col: number) {
        const component = this;
        $('#' + col).each(function() {
          if ($(this).attr('class') === 'box') {
            $(this).addClass('boxSelected');
            component.tableIndexNumber++; 
          } else {
            $(this).removeClass('boxSelected').addClass('box');
          }
        });
    }
}

在每个循环的Jquery内部使用TypeScript变量

1 个答案: