如何使用 PrimeNg 显示 Angular pTooltip？

Question

我正在使用 PrimeNg 并且我有一个数据表。 当我将鼠标悬停在行/单元格上时，我希望该单元格的内容显示在 pTooltip 中。 当我这样做时：

{{statement.description}}

该表不显示。 如果我做：

statement.description

该表显示但 pTooltip 仅显示文本“statement.description”。

这是模板中的数据表代码：

    <p-dataTable [globalFilter]="gb" [value]="statements" [paginator]="true" [rows]="3" selectionMode="single" id="dtt" [(selection)]="selectedStatement" (onRowClick)="selectOverlay($event, statement, op)" (onRowDblclick)="onRowSelect($event)">
        <p-header>
        Statements from this source
        </p-header>
        <p-column field="description" header="Description">
            <ng-template let-col let-row="rowData" let-ri="rowIndex" pTemplate="body" >
                <span #z>{{ row[col.field] | truncate:[150] }}<i tabindex="0" class="fa fa-ellipsis-h" aria-hidden="true" tooltipEvent="focus" tooltipPosition="top" pTooltip="{{statement.description}}"></i></span>
            </ng-template>
        </p-column>
        <p-column [style]="{'width': '1.5em'}">
            <ng-template let-col let-row="rowData" let-ri="rowIndex" pTemplate="body">
                <span><i class="icon-unlink"></i></span> 
            </ng-template>    
        </p-column>
    </p-dataTable>

Answer 1

尝试[pTooltip]="statement.description" （带方括号）