Cordova-연락처

이 플러그인은 장치의 연락처 데이터베이스에 액세스하는 데 사용됩니다. 이 자습서에서는 연락처를 생성, 쿼리 및 삭제하는 방법을 보여줍니다.

1 단계-연락처 플러그인 설치

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

2 단계-버튼 추가

버튼은 createContact함수. 우리는 그것을div class = "app"index.html 파일.

<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)

이제 장치에 저장된 연락처가 없습니다.

첫 번째 콜백 함수는 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 버튼을 누르면 새 연락처가 장치 연락처 목록에 저장됩니다.

3B 단계-콜백 기능 (navigator.contacts.find)

두 번째 콜백 함수는 모든 연락처를 쿼리합니다. 우리는navigator.contacts.find방법. 옵션 개체에는 검색 필터를 지정하는 데 사용되는 필터 매개 변수가 있습니다.multiple = true장치에서 모든 연락처를 반환하려고하기 때문에 사용됩니다. 그만큼field 연락처를 검색하는 키 displayName 연락처를 저장할 때 사용했기 때문입니다.

옵션을 설정 한 후 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 버튼을 누르면 하나의 연락처 만 저장되었으므로 하나의 경고 팝업이 트리거됩니다.

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);
   }
	
}

이제 장치에 하나의 연락처 만 저장됩니다. 삭제 프로세스를 보여주기 위해 수동으로 하나 더 추가합니다.

이제 DELETE CONTACT 버튼을 삭제하려면 Test User. 연락처 목록을 다시 확인하면Test User 더 이상 존재하지 않습니다.