无法使用组件@ ncstate / sat-popover绑定到属​​性“ satPopoverAnchorFor”

时间:2019-07-05 13:05:24

标签: angular angular-material popover

很抱歉这个基本问题。我是Angular项目的新手。

我想将@ ncstate / sat-popover组件与Angular材质表一起使用。目的是对表行中的字段进行内联编辑。我从stackblitz的这个例子中得到了启发。 https://stackblitz.com/edit/inline-edit-mat-table?file=app%2Fapp.component.html

我使用它的方式示例:

    <mat-cell *matCellDef="let row" [satPopoverAnchorFor]="p" (click)="p.open()">
      <ng-container *ngIf="row.consumption_id">
        {{row.consumption_id}}
      </ng-container>

      <span class="add-consumption_id" *ngIf="!row.consumption_id">
        Add a consumption id.
      </span>

      <sat-popover #p
          hasBackdrop
          xAlign="start"
          yAlign="start"
          (closed)="update(row, $event)">
        <inline-edit [value]="row.consumption_id"></inline-edit>
      </sat-popover>
    </mat-cell>

我得到了错误:

SCRIPT5022: Template parse errors:
**Can't bind to 'satPopoverAnchorFor' since it isn't a known property of 'mat-cell'.**
1. If 'mat-cell' is an Angular component and it has 'satPopoverAnchorFor' input, then verify that it is part of this module.
...

我已经使用不同版本的Angular(8.0.0和8.1.0)重新创建了该项目的2倍

一切看起来都正确地安装并导入到我的项目中。

对我错过的事情有任何想法吗?

谢谢你, 弗雷德

2 个答案:

答案 0 :(得分:0)

尝试一下<mat-cell *matCellDef="let row" satPopoverAnchorFor="p" (click)="p.open()">

答案 1 :(得分:0)

在最新版本中,属性从[satPopoverAnchorFor]更改为[satPopoverAnchor]。

 <td mat-cell *matCellDef="let product" [satPopoverAnchor]="p" (click)="p.open()">  {{product.case_height}}
        <sat-popover #p
        hasBackdrop
        xAlign="start"
        yAlign="start"
        (closed)="updateProduct(product,'case_height', $event)">

               <inline-edit [sku]="product.case_height" [fieldname]="'Case Height'" [fieldvalue]="product.case_height"></inline-edit>
        </sat-popover>


 </td>