[英]How to call a function received from async stream using Angular async pipe? Error: Cannot have a pipe in an action expression
我想調用一個 function 使用 Angular 9 async Z20826A3CB51DBF46CCED 從 stream 數據接收
以下代碼(onApprove)="(modalData$ | async).onApprove()"
拋出此錯誤: Cannot have a pipe in an action expression
我在網上找不到解決方案,只能參考有關 ngModel 的問題( 示例)
<div class="confirm-modal-container">
<div class="title">{{(modalData$ | async).title}}</div>
<div class="body">{{(modalData$ | async).body}}</div>
<app-action-buttons (onApprove)="(modalData$ | async).onApprove()" (onCancel)="(modalData$ | async).onCancel()" [cancelText]="currentStep === 0 ? 'Cancel' : 'Previous'" [approveText]="control[currentStep].actionBtnText"></app-action-buttons>
</div>
數據 stream 來自 Redux 存儲
@select((state: IAppState) => state.ui.modal.modalData) readonly modalData$: Observable<any>;
您可以在ng-container
分組元素中提取響應,並在所有較低嵌套級別使用 reposne。 這樣你甚至不需要每次都調用async
。
<div class="confirm-modal-container">
<ng-container *ngIf="modalData$ | async as modelData">
<div class="title">{{modelData.title}}</div>
<div class="body">{{modelData.body}}</div>
<app-action-buttons (onApprove)="modelData.onApprove()" (onCancel)="modelData.onCancel()" [cancelText]="currentStep === 0 ? 'Cancel' : 'Previous'" [approveText]="control[currentStep].actionBtnText"></app-action-buttons>
</ng-container>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.