如何解决NGX Bootstrap Typeahead,一次使用多个模板
我使用 ngx-bootstrap typeahead 进行自动完成。如果响应是数组,则会填充模板。但我有一个回应作为一个对象。我的回答类似于
{
"set1": [],"set2": [],"set3": [],}
现在我希望为每组数组呈现不同的模板。
<input (typeaheadLoading)="changeTypeaheadLoadingAlbum($event)"
(typeaheadOnSelect)="typeaheadOnSelectAlbum($event)" [class.is-invalid]="searchFailed"
[isAnimated]="true" [typeaheadAsync]="true" [typeaheadScrollable]="true"
[typeaheadMinLength]="2" [typeahead]="rsAlbum$ "
[typeaheadItemTemplate]="albumItemCustomTemplate" class="form-control form-control-lg"
formControlName="albumItem" id="typeahead-http" placeholder="Enter name of album to search..."
type="text" />
<ng-template #albumItemCustomTemplate class="suggestions">
<!-- for set1 -->
<ng-template let-index="index" let-model="item">
<div class="_dropdown-item"> {{r}} {{ model.name }} </div>
</ng-template>
<!-- for set2 -->
<ng-template let-index="index" let-model="item">
<h5>This is: {{model | json}} Index: {{ index }}</h5>
<div class="_dropdown-item">
{{ model.name }}
<span *ngIf="model.year != 0" class="year">- ({{ model.year }})</span>
</div>
</ng-template>
</ng-template>
在单个调用中填充两个模板样式所需的任何增强。我收到错误 Typeahead options.slice is not a function
。如果响应是简单的数组,它就可以工作。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。