javascript - Displaying Message when no search result found in Angular
问题描述
The this.searchError
shows even if docCheck.id
not equals null.
I have tried setting whether the result.length
of the search equals zero to display the error message.
However, I get from the console data.map error
filterDocument(customerId: number, from: string, to: string, criterion: string) {
this.filteredDocument = [];
this.searchError = '';
this.documentService.getDocuments(customerId, privateDoc, from, to,
criterion).subscribe(
data => {
if(this.docCheck.id == null){
this.searchError ='No search related document found';
console.log('No related search found')
}
this.showspinner = false;
data.map(item => {
this.filteredDocument.push(item);
console.log('this is the data from filter:', data);
});
this.showspinner = false;
},
error1 => {
this.swalWithBootstrapButtons.fire(
'Error!',
'Error inesperado al mostrar el filtro.',
'error'
);
});
// this.documents = this.filteredDocument;
}
}
HTML- Table Display
<div *ngIf="!showspinner && searchError" class="card">
<div class="card-header notification py-3">
<span class="font-weight-bold text-dark">{{searchError}}</span>
</div>
</div>
<table *ngIf="!showspinner && filteredDocument.length>0">
<thead>
<tr class="bg-primary text-white" >
<th class="text-left" scope="col">Date Registration</th>
<th class="text-left" scope="col">Title of Document</th>
</tr>
</thead>
<tbody *ngFor="let doc of filteredDocument">
<tr>
<td class="text-left">{{doc.date | date: 'dd-MM-yyyy'}}</td>
<td class="text-left" [title]="doc.name ? doc.name : ''">{{doc.name}}
<!--<b>{{(doc.name) ? (doc.name | slice:0:45) + '...' : (doc.date)}}</b>-->
<span *ngIf="!doc.name">-----</span>
</td>
</tr>
</tbody>
</table>
解决方案
推荐阅读
- google-chrome - 将 PC/Mac 从长时间待机唤醒后,setInterval、setTimeout 和 chrome.alarms API 在 chrome 扩展后台脚本中不起作用
- plsql - 如何接收将数据插入表的过程/函数?
- python - Python SQL - 无法插入数据库。(没有错误)
- python - argparse 显示 __main__.py 而不是可执行模块名称
- css - 尝试实现页眉、主页和页脚 React JS
- regex - 如何将 mongodb shell 查询写入 golang
- tensorflow - 如果模型的输入形状未知,如何在特征图上实现调整大小?
- java - 托管在云中时,自定义 Spring 启动异常处理程序不起作用
- ruby-on-rails - Zeitwerk“弃用警告:初始化自动加载常量”是由于在 lib 文件夹中包含一个模块引起的
- git - 从另一个分支合并时选择要合并的行