1
我用自定義過濾器的Ag-grid製作了一個表格。我想在搜索字段中添加typeahead/autocomplete函數。但我得到一個錯誤：使用Angular 2的Ag-grid Typeahead
無法綁定到'ngbTypeahead'，因爲它不是'input'的已知屬性。 （ 「 過濾：] [ngbTypeahead] = 」搜索「 （ngModelChange）= 」的onChange（$事件）「 [ngModel] = 」文本「> 」）：ProjectFilterComponent @ 2:8
I」 m使用外部庫（ng-bootstrap）作爲我自定義過濾器中的typeahead。
@Component({
selector: 'filter-cell',
template: `
Filter: <input style="height: 20px"
[ngbTypeahead]="search"
(ngModelChange)="onChange($event)"
[ngModel]="text">
`
})
class ProjectFilterComponent implements AgFilterComponent{
public params:IFilterParams;
public valueGetter:(rowNode:RowNode) => any;
public text;
allTextFromProject = this.order.projects
constructor(private order : WorkorderComponent){
}
@ViewChild('projectinput', {read: ViewContainerRef}) public input;
agInit(params:IFilterParams):void {
this.params = params;
this.valueGetter = params.valueGetter;
}
isFilterActive():boolean {
return this.text !== null && this.text !== undefined && this.text !== '';
}
doesFilterPass(params:IDoesFilterPassParams):boolean {
return this.text.toLowerCase()
.split(" ")
.every((filterWord) => {
return this.valueGetter(params.node).toString().toLowerCase().indexOf(filterWord) >= 0;
});
}
getModel():any {
return {value: this.text};
}
setModel(model:any):void {
this.text = model.value;
}
afterGuiAttached(params:IAfterFilterGuiAttachedParams):void {
this.input.element.nativeElement.focus();
}
search = (text$: Observable<string>) =>{
text$
.debounceTime(200)
.distinctUntilChanged()
.map(term => term.length < 1 ? []
: this.order.projects.filter(v => new RegExp(term, 'gi').test(v)).splice(0, 10));
onChange(newValue):void {
if (this.text !== newValue) {
console.log(newValue)
this.text = newValue;
this.order.filterFunction(newValue, this.params.colDef.colId, this.order.page)
}
}
的[ngbTypeahead]在不使用AG-網格中的其他搜索領域的正常工作。我需要AG-網格的搜索領域[ngbTypeahead]功能