Question

我有mat-toolbar和一个按钮。当我尝试获取按钮的位置时，它为我提供了错误的left / right值。在下面的示例中，两个按钮返回相同的位置，尽管一个按钮位于屏幕的开头，另一个按钮位于屏幕的结尾。

HTML：

<mat-toolbar color="primary">
 <mat-toolbar-row>
    <span> toolbar</span>
    <span class="example-spacer"></span>
    <button #rowBtn mat-button (click)="clickButtonOut()">
      click me
    </button>
  </mat-toolbar-row>
</mat-toolbar>
<button #outOfRowBtn mat-stroked-button (click)="clickButtonOut()">button outside of toolbar</button>

Ts：

 @ViewChild('rowBtn',{static: false}) row: any;
 @ViewChild('outOfRowBtn',{static: false}) out: any;


 clickButtonRow(){
   alert(this.row._elementRef.nativeElement.getBoundingClientRect().left)
 }

clickButtonOut(){
  alert(this.out._elementRef.nativeElement.getBoundingClientRect().left)
}

https://stackblitz.com/edit/angular-bk38qb

Answer 1

您始终调用相同的函数。您永远无法获得正确的价值。您必须将一个函数调用从docker logs kibana更改为clickButtonOut()！

您的代码：

clickButtonRow()

垫工具栏中的按钮左/右位置错误

1 个答案: