为什么异步管道 "InvalidPipeArgument: '[object Object],[object Object],' for pipe 'AsyncPipe'" 有错误？

Question

我正在尝试通过 ng-bootstrap 在 table 中应用搜索。但是异步管道中有一个错误 ="InvalidPipeArgument: '[object Object],[object Object],[object Object],[object Object],[object Object]' for pipe 'AsyncPipe'" 我已经申请了与 ng-botstrap 网站中显示的相同。

 <table class="table table-striped">
  
          <thead class="thead-dark">
  
            <tr>
              <th>S.No.</th>
              <th>Name</th>
              <th>Email</th>
              <th>Date Of Birth</th>
              <th>Contact Number</th>
              <th>Image</th>
              <th>Action</th>
              
            </tr>
          </thead>
  
          <tbody>
            <tr *ngFor="  let recentDetails of user$ | async; index as i ">
              <td >{{i+1+((tableModel.Page-1)*tableModel.pageSize)}}</td>
              <td ><ngb-highlight [result]="recentDetails.name" [term]="filter.value"></ngb-highlight></td>
              <td ><ngb-highlight [result]="recentDetails.email" [term]="filter.value"></ngb-highlight></td>
              <td ><ngb-highlight [result]="recentDetails.dateOfBirth" [term]="filter.value"></ngb-highlight></td>
              <td ><ngb-highlight [result]="recentDetails.contactNumber" [term]="filter.value"></ngb-highlight></td>
              <td><img src="https://localhost:44342/Images/{{recentDetails.userImageGuid}}"></td> 
              <td> <button class="btn btn-warning" (click)="editUserDetails(recentDetails.email)">Edit</button> &nbsp;
                <button class="btn btn-danger" (click)="deleteRow(recentDetails.id,i)">Delete</button>
              </td>
            </tr>
          </tbody>
        </table>

请帮帮我。提前谢谢。

Answer 1

听起来 user$ 是对象数组而不是对象数组的可观察对象。如果是这种情况，您可以删除 | async 并且它应该可以正常工作。

如果您需要 user$ 成为可观察对象，则必须重新检查您的 Typescript 代码。此外，如果您需要这方面的帮助，您也应该分享相关的 TS 代码片段。

为什么异步管道 "InvalidPipeArgument: '[object Object],[object Object],' for pipe 'AsyncPipe'" 有错误？

why there is error in async pipe "InvalidPipeArgument: '[object Object],[object Object],' for pipe 'AsyncPipe'"?

html

angular

typescript

bootstrap-4

ng-bootstrap