コルドバ-連絡先

このプラグインは、デバイスの連絡先データベースにアクセスするために使用されます。このチュートリアルでは、連絡先を作成、クエリ、削除する方法を示します。

手順1-連絡先プラグインをインストールする

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugincontacts

ステップ2-ボタンの追加

このボタンは、 createContact 関数の呼び出しに使用されます。 indexl ファイルの div class = "app" に配置します。

<button id = "createContact">ADD CONTACT</button>
<button id = "findContact">FIND CONTACT</button>
<button id = "deleteContact">DELETE CONTACT</button>

手順2-イベントリスナーの追加

*index.js* を開き、次のコードスニペットを *onDeviceReady* 関数にコピーします。

document.getElementById("createContact").addEventListener("click", createContact);
document.getElementById("findContact").addEventListener("click", findContact);
document.getElementById("deleteContact").addEventListener("click", deleteContact);

ステップ3A-コールバック関数（navigator.contacts.create）

現在、デバイスには連絡先が保存されていません。

Cordova Contact Empty

最初のコールバック関数は、新しい連絡先データを指定できる navigator.contacts.create メソッドを呼び出します。これにより、連絡先が作成され、 myContact 変数に割り当てられますが、デバイスには保存されません。保存するには、 save メソッドを呼び出して、成功およびエラーコールバック関数を作成する必要があります。

function createContact() {
   var myContact = navigator.contacts.create({"displayName": "Test User"});
   myContact.save(contactSuccess, contactError);

   function contactSuccess() {
      alert("Contact is saved!");
   }

   function contactError(message) {
      alert('Failed because: ' + message);
   }

}

*ADD CONTACT* ボタンをクリックすると、新しい連絡先がデバイスの連絡先リストに保存されます。

Cordova Contact Create

ステップ3B-コールバック関数（navigator.contacts.find）

2番目のコールバック関数は、すべての連絡先を照会します。 navigator.contacts.find メソッドを使用します。 optionsオブジェクトには、検索フィルターを指定するために使用されるフィルターパラメーターがあります。デバイスからすべての連絡先を返すため、 multiple = true が使用されます。連絡先を保存するときに使用したため、 displayName で連絡先を検索する field キー。

オプションを設定したら、 find メソッドを使用して連絡先を照会します。見つかった連絡先ごとにアラートメッセージがトリガーされます。

function findContacts() {
   var options = new ContactFindOptions();
   options.filter = "";
   options.multiple = true;
   fields = ["displayName"];
   navigator.contacts.find(fields, contactfindSuccess, contactfindError, options);

   function contactfindSuccess(contacts) {
      for (var i = 0; i < contacts.length; i++) {
         alert("Display Name = " + contacts[i].displayName);
      }
   }

   function contactfindError(message) {
      alert('Failed because: ' + message);
   }

}

*FIND CONTACT* ボタンを押すと、連絡先が1つしか保存されていないため、1つのアラートポップアップがトリガーされます。

Cordova Contacts Find

ステップ3C-コールバック関数（削除）

この手順では、findメソッドを再度使用しますが、今回はさまざまなオプションを設定します。 options.filter は、削除する必要がある Test User を検索するように設定されています。 contactfindSuccess コールバック関数が必要な連絡先を返した後、独自の成功およびエラーコールバックを必要とする remove メソッドを使用して削除します。

function deleteContact() {
   var options = new ContactFindOptions();
   options.filter = "Test User";
   options.multiple = false;
   fields = ["displayName"];
   navigator.contacts.find(fields, contactfindSuccess, contactfindError, options);

   function contactfindSuccess(contacts) {
      var contact = contacts[0];
      contact.remove(contactRemoveSuccess, contactRemoveError);

      function contactRemoveSuccess(contact) {
         alert("Contact Deleted");
      }

      function contactRemoveError(message) {
         alert('Failed because: ' + message);
      }
   }

   function contactfindError(message) {
      alert('Failed because: ' + message);
   }

}

これで、デバイスに保存される連絡先は1つだけになりました。削除プロセスを示すために、手動でもう1つ追加します。

Cordova Contacts Multiple

ここで、[ DELETE CONTACT ]ボタンをクリックして、 Test User を削除します。連絡先リストを再度確認すると、 Test User がもう存在しないことがわかります。

Cordova連絡先が削除されました

Cordova-contacts

目次