1

每当我将 AOT 与 angular cli 一起使用时,每当我使用模板标签将内容传递给它时,我的一个组件上就会出现这种奇怪的闪烁。

零件:

export class SelectComponent implements ControlValueAccessor, OnDestroy, OnInit {
  @ContentChild(TemplateRef) templateRef: TemplateRef<any>;

  / .... /
}

组件模板:

<div #select>
  <ul>
    <li>
      <div #toggler (tap)="toggle()">
        <span #selected>
          <template [ngTemplateOutlet]="templateRef" [ngOutletContext]="{$implicit: model}"></template>
        </span>
      </div>
      <ul>
        <li *ngFor="let option of options" (tap)="selectOption(option)">
          <span #optionContent>
            <template [ngTemplateOutlet]="templateRef" [ngOutletContext]="{$implicit: option}"></template>
          </span>
        </li>
      </ul>
    </li>
  </ul>
</div>

用法:

<custom-select [(ngModel)]="currentVariant" [options]="options">
  <template let-option>
    <span *ngFor="let text of [option?.engine?.name, option?.supplements, option?.engine?.fuelType?.name, option?.engine?.horsepowers ? option?.engine?.horsepowers + 'hk' : option?.engine?.horsepowers]">{{text}}</span>
  </template>
  <template let-model>
    <span *ngFor="let text of [model?.engine?.name, model?.supplements, model?.engine?.fuelType?.name, model?.engine?.horsepowers ? model?.engine?.horsepowers + 'hk' : model?.engine?.horsepowers]">{{text}}</span>
  </template>
</custom-select>

有谁知道这里发生了什么?不幸的是,找不到任何关于它的信息。

4

0 回答 0