Javascript 在函数内部使用公共变量

我有两个可以显示面板状态的窗口。
我试图实现的是，当我打开/关闭面板时，幻灯片切换的属性

checked

必须设置为true/false

我的组件中有2个公共变量：

  public isOverviewVisible: boolean = true;
  public isDetailsVisible: boolean = false

我在html文件中使用它

  <div class="col-auto align-self-end">
    <mat-slide-toggle ngDefaultControl (change)="showOverviewChange($event)" [checked]="isOverviewVisible">
      Show overview
    </mat-slide-toggle>
  </div>
  ...

问题是，如何在函数

onDragEnd

？
或者有更好的方法

更新
我将代码更改为使用arrow函数，但现在在split.getSizes（）上出现错误。：类型“（）=>any”上不存在属性“getSizes”

尝试：

let split=（）=>split（['#概述'，'#细节']{
onDragEnd:（）=>{
let size:number[]=split.getSizes（）；
如果（大小[0]<1）{
this.isOverviewVisible=false；
}否则{
this.isOverviewVisible=true；
}
...
}
});尝试：


let split=（）=>split（['#概述'，'#细节']{
onDragEnd:（）=>{
let size:number[]=split.getSizes（）；
如果（大小[0]<1）{
this.isOverviewVisible=false；
}否则{
this.isOverviewVisible=true；
}
...
}
});
您需要在
onDragEnd
函数中使用箭头函数，以便
此
是类实例：

    let split = Split(['#overview', '#detail'], {
    onDragEnd: () => {
      let sizes: number[] = split.getSizes();

      if (sizes[0] < 1) {
        this.isOverviewVisible = false;
      } else {
        this.isOverviewVisible = true;
      }
      ...
    }
});

let split=split（['#概述'，'#细节']{
onDragEnd:（）=>{
let size:number[]=split.getSizes（）；
如果（大小[0]<1）{
this.isOverviewVisible=false；
}否则{
this.isOverviewVisible=true；
}
...
}
});
您需要在
onDragEnd
函数中使用箭头函数，以便
此
是类实例：

    let split = Split(['#overview', '#detail'], {
    onDragEnd: () => {
      let sizes: number[] = split.getSizes();

      if (sizes[0] < 1) {
        this.isOverviewVisible = false;
      } else {
        this.isOverviewVisible = true;
      }
      ...
    }
});

let split=split（['#概述'，'#细节']{
onDragEnd:（）=>{
let size:number[]=split.getSizes（）；
如果（大小[0]<1）{
this.isOverviewVisible=false；
}否则{
this.isOverviewVisible=true；
}
...
}
});
使用箭头函数，否则
这将不是您所期望的
onDragEnd:（）=>{
使用箭头函数，这样你就不会失去作用域：
onDragEnd:（）=>{…
使用箭头函数，否则
这将不是你期望的。
onDragEnd:（）=>{
使用箭头函数，这样你就不会失去作用域：
onDragEnd:（）=>{…
谢谢，请参阅更新的答案。我在getSizes（）下看到一条红线；谢谢，请参阅更新的答案。我在getSizes（）下看到一条红线；谢谢，请参阅更新的答案。我在getSizes（）下看到一条红线；这不足以说明红线的原因（我想是林特问题）。将鼠标悬停在红线上应该会显示标记的原因。信息原因已在我的更新答案中说明。谢谢，请参阅更新的答案。我在getSizes（）下得到一条红线；这不足以说明红线的原因（我想是林特问题）。将鼠标悬停在红线上应该会显示为什么会标记。信息原因已在我更新的答案中说明。
    let split = Split(['#overview', '#detail'], {
    onDragEnd: () => {
      let sizes: number[] = split.getSizes();

      if (sizes[0] < 1) {
        this.isOverviewVisible = false;
      } else {
        this.isOverviewVisible = true;
      }
      ...
    }
});