找到联系人后如何选择?离子2 [英] How do I select contact after finding it ? Ionic 2

问题描述

我正在尝试从列表中选择一个选项.搜索后，应该可以选择并显示在搜索栏上，例如此.到目前为止，这是我所做的.

I am trying to select an option from a list. Once I search, should be able to select and show it on the search bar like this. Here's what I have done so far.

我可以搜索联系人.我接下来要做的就是从列表中选择该联系人并将其添加到搜索栏(例如gmail和all).

I am able to search contact. All I want to do next is select that contact from list and add it to search bar (like gmail and all).

模板

<ion-content padding>
  <ion-searchbar (ionInput)="findContact($event)" placeholder="Enter display name">
    <button ion-button color="light" (click)="findContact($event)" icon-only>
        <ion-icon name="add"></ion-icon>
      </button>
  </ion-searchbar>

  <ion-list [hidden]="!search">
    <ion-item *ngFor="let item of contactsfound">{{item.displayName}}</ion-item>
  </ion-list>
</ion-content>

home.ts

findContact(ev: any) {
  let fields: ContactFieldType[] = ['displayName'];

  const options = new ContactFindOptions();
  options.filter = ev.target.value;
  options.multiple = true;
  options.hasPhoneNumber = true;

  this.contact.find(fields, options).then((contacts) => {
    this.contactsfound = contacts;
    console.log(JSON.stringify(contacts[0]));
  });

  if (this.contactsfound.length == 0) {
    this.contactsfound.push({
      displayName: 'No Contacts found'
    });
  }
  this.search = true;
}

推荐答案

好，所以我找到了解决方案.基本上我是在谈论离子芯片.我正在浏览文档并找到它.我在ng-container下使用过离子芯片；添加了一些将从离子列表中选择选项的功能(注意:不是从离子选择中选择)，并将所选的选项显示为html模板中的芯片:)

Ok So I found the solution. Basically I was talking about ion-chips. I was going through docs and found it. I have used ion-chips under ng-container; added some function that will select option from the ion-list (note: not from the ion-select) and show that selected option as a chip in the html template :)

这篇关于找到联系人后如何选择?离子2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！