ng2-ui / auto-complete

Angular Auto Complete component and directive
http://ng2-ui.github.io/auto-complete/
MIT License
279 stars 124 forks source link

if we use observable and getting values then auto complete is not working it only displays list but does not perform filtering . #355

Closed harshkan closed 2 weeks ago

harshkan commented 6 years ago

IMPORTANT Please be specific with an example. An issue with no example may be closed.

Steps to reproduce and a minimal demo

Current behavior

Expected/desired behavior

Other information

harshkan commented 6 years ago

for eg: table.component.ts : import { Component, OnInit } from '@angular/core'; import { Observable } from 'rxjs/Observable'; import { Http, Response, Headers, RequestOptions } from '@angular/http'; import { DomSanitizer, SafeHtml } from "@angular/platform-browser"; import 'rxjs/add/observable/of'; import { DemoService } from '../demo.service'; @Component({ selector: 'app-table', templateUrl: './table.component.html', styleUrls: ['./table.component.css'], providers: [DemoService] }) export class TableComponent implements OnInit { characters: any=[]; selected: string; tdata :any=[]; settings = { columns: { id: { title: 'ID' }, name: { title: 'Name' }, age: { title: 'Age' }, brass:{ title: 'brass' },

  },
  defaultStyle: 'false',
  attr:{
    class : 'table table-bordered'
  }
};

autocompleListFormatter = (data: any) : SafeHtml => {
   let html = `<span>${data.name}</span>`;
   return this._sanitizer.bypassSecurityTrustHtml(html);
 }

constructor(public http: Http,private _sanitizer: DomSanitizer,private _demoService:DemoService) {

}

ngOnInit() { this.characters=[{'id':1,'name':'har','age':20,'brass':'inr4556'}, {'id':2,'name':'hu','age':25,'brass':'pnr4556'}, {'id':3,'name':'hnmmr','age':9,'brass':'pnr456'}, {'id':4,'name':'opar','age':2,'brass':'ir4556'}, {'id':5,'name':'ar','age':220,'brass':'nr4556'} ]; console.log(this.characters); this.getallrequests();

}

observableSource = (keyword: any): Observable<any[]> => {

return Observable.of(this.tdata);

}
getallrequests()

{ this._demoService.getallrequests().subscribe( // the first argument is a function which runs on success data => { this.tdata = data; console.log(this.tdata); }, // the second argument is a function which runs on error err => console.error(err), // the third argument is a function which runs on completion () => console.log('done loading table') ); }

}

table.component.html <ng2-smart-table [settings]="settings" [source]="characters"> {{characters| json}}

<input ng2-auto-complete [(ngModel)]="selected" [source]="observableSource.bind(this)"

placeholder="Contients" />
selected model: {{selected | json}}

``

almothafar commented 2 weeks ago

This issue is stale. Please consider opening a new issue with details for the latest version if you are still facing the same issue or need improvement.

Closing it.