[nzScroll]的x如何获取
时间: 2023-12-24 18:02:18 浏览: 16
[nzScroll]指的是Angular中的指令,用于实现滚动功能。如果你想获取[nzScroll]的x值,可以通过在对应的组件中使用ViewChild来获取指令的实例,然后通过该实例的scrollX属性来获取x值。具体代码如下:
在组件中添加ViewChild:
```
@ViewChild('scrollDirective', { static: false }) scrollDirective: NzScrollDirective;
```
在模板中使用[nzScroll]指令,并给指令添加一个引用:
```
<div nz-scroll [nzScrollX]="100" #scrollDirective>
// 内容
</div>
```
获取x值:
```
const x = this.scrollDirective.scrollX;
```
相关问题
[nzScroll]的x是如何计算的
[nzScroll]是指NG-ZORRO的滚动条组件,它的x属性是用来设置水平滚动条位置的。x的计算方式取决于滚动条的宽度和滚动内容的宽度。如果滚动内容的宽度小于等于容器的宽度,x应该为0(即滚动条不需要滚动)。如果滚动内容的宽度大于容器的宽度,x应该是滚动条左边缘到容器左边缘的距离,也就是说,x的值等于滚动条左边缘到容器左边缘的距离除以滚动条的总宽度再乘以滚动内容的宽度与容器宽度的差值。
src/main/webapp/app/entities/equipment/list/equipment.component.html:34:23 - error TS2322: Type 'IEquipment[] | undefined' is not assignable to type 'readonly IEquipment[]'. Type 'undefined' is not assignable to type 'readonly IEquipment[]'. 34 <nz-table #table [nzData]="tableData" nzBordered [nzScroll]="{ x: '12000px', y: '800px' }" [nzPageSize]="20"> ~~~~~~ src/main/webapp/app/entities/equipment/list/equipment.component.ts:15:16 15 templateUrl: './equipment.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component EquipmentComponent.
这个错误是因为你正在尝试将类型为 'IEquipment[] | undefined' 的变量赋值给类型为 'readonly IEquipment[]' 的变量,而这是不允许的。这通常发生在当你使用了可选的变量时(例如:tableData?: IEquipment[]),在某些情况下,变量可能没有被初始化。解决这个问题的方法是要么在定义变量时给它赋一个默认值,要么在使用该变量之前添加一个非空断言符号(!),告诉编译器该变量已经被初始化并且不为空。你可以尝试将变量定义更改为:tableData!: IEquipment[]; 这样就可以防止出现这个错误。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pptx](https://img-home.csdnimg.cn/images/20210720083543.png)
![txt](https://img-home.csdnimg.cn/images/20210720083642.png)