首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >单击按钮打开自动完成

单击按钮打开自动完成
EN

Stack Overflow用户
提问于 2017-06-06 13:50:03
回答 0查看 956关注 0票数 0

我正在Angular2应用程序中使用ofer的自动完成功能

https://github.com/oferh/ng2-completer

我想要这样一种行为,即自动完成不会在输入时自动打开,但我需要按一个按钮,只有在那时自动完成才会发出服务器请求并显示我试图实现CompleterData的下拉列表:

代码语言:javascript
复制
import { Http, Response } from "@angular/http";
import { Subject } from "rxjs/Subject";
import { HttpClient } from './shared';
import { CompleterData, CompleterItem } from 'ng2-completer';

export class AddressData extends Subject<CompleterItem[]> implements CompleterData {
    private url: string;

    constructor(private http: HttpClient, public erpIDParent: number, url: string) {
        super();
        this.url = url;
    }

    public setErpIDParent(erpIDParent: number) {
        this.erpIDParent = erpIDParent;
    }

    public search(term: string): void {
        console.log('searching');
        if (this.erpIDParent > 0) {
            this.http.get(`${this.url}${term}&erpIDParent=${this.erpIDParent}`)
                .map((res: Response) => {
                    // Convert the result to CompleterItem[]
                    let data = res.json();
                    let matches: CompleterItem[] = data.map((address: any) => {
                        return {
                            originalObject: address,
                            title: address.Name
                        }
                    });
                    console.log(matches);
                    this.next(matches);
                })
                .subscribe();
        }
    }

    public cancel() {
        // Handle cancel
    }
}

并将minSearchLength保持在1000

代码语言:javascript
复制
<ng2-completer placeholder="{{ 'NewOrder.typeToSearch' | translate }}" formControlName="address" [(ngModel)]="address" [datasource]="addressDataService" (selected)="addressSelected($event)" [minSearchLength]="1000"></ng2-completer>

所以它不会发送服务器请求,然后点击我的按钮,我有这个代码:

代码语言:javascript
复制
searchAddresses() {
        this.addressDataService.search(this.address);
    }

所以它会手动开始搜索,但它似乎不是我想要的方式。下拉列表可以立即显示和隐藏。有没有办法解决这个问题?

EN

回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/44382235

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档