如何访问Primeng表的style属性

Question

在角度项目中，我需要测试primeng数据表的显示表宽度是否设置为我赋给它的maxWidth值。 为此，我想调用[style]属性来获取宽度，看它是否等于我的maxWidth。 但是，我不知道如何调用这样的属性。 我该怎么做？ 目前我不知道如果我朝着正确的方向前进。

我尝试了几件事，但我不确定它的语法。

<p-table class="p-table" ... [style] = "{width: maxWidth}" >

it('should implement maxwidth', () => {
    const widthDebug: DebugElement = fixture.debugElement;
    const tableWidth = widthDebug.query(By.css('.ui-table .ui-widget'));
    const ptable: HTMLElement = tableWidth.nativeElement;

    expect(ptable.textContent).toContain("width: " + component.maxWidth);

});

expected：success（ptable.textContent包含“width：component.maxWidth”）实际：TypeError：无法读取属性“nativeElement”的null

Answer 1

我看到现在问你问题已经两个月了，所以我的回答可能为时已晚，但我在查找有关PrimeNG的其他内容时偶然发现了这篇文章，所以我不妨试一试。

这里的问题是nativeElement是在Angular p-table组件的Dialog类实例上定义的。 它没有在任何特定的DOM元素上定义。

By.css('.ui-table .ui-widget')将为您找到一个DOM元素，而不是一个Angular类实例。 特别是在<p-dialog> DOM元素中可以找到的是<div> ，而这个<div>通过[style]=...接收样式集。

当你的代码写在tableWidth.style.width之上tableWidth.style.width它将包含（作为一个字符串）你期望找到的maxWidth的值。