Cordova - Danh bạ

Plugin này được sử dụng để truy cập cơ sở dữ liệu danh bạ của thiết bị. Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách tạo, truy vấn và xóa danh bạ.

Bước 1 - Cài đặt Plugin Danh bạ

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

Bước 2 - Thêm các nút

Nút sẽ được sử dụng để gọi createContactchức năng. Chúng tôi sẽ đặt nó trongdiv class = "app" trong index.html tập tin.

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

Bước 2 - Thêm người nghe sự kiện

Mở index.js và sao chép đoạn mã sau vào onDeviceReady chức năng.

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

Bước 3A - Chức năng gọi lại (Navigator.contacts.create)

Bây giờ, chúng tôi không có bất kỳ liên hệ nào được lưu trữ trên thiết bị.

Hàm gọi lại đầu tiên của chúng tôi sẽ gọi navigator.contacts.createphương pháp mà chúng tôi có thể chỉ định dữ liệu liên hệ mới. Thao tác này sẽ tạo một liên hệ và gán nó chomyContactnhưng nó sẽ không được lưu trữ trên thiết bị. Để lưu trữ nó, chúng ta cần gọisave và tạo các hàm gọi lại thành công và lỗi.

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

Khi chúng tôi nhấp vào ADD CONTACT , số liên lạc mới sẽ được lưu vào danh sách liên lạc của thiết bị.

Bước 3B - Chức năng gọi lại (Navigator.contacts.find)

Chức năng gọi lại thứ hai của chúng tôi sẽ truy vấn tất cả các địa chỉ liên hệ. Chúng tôi sẽ sử dụngnavigator.contacts.findphương pháp. Đối tượng tùy chọn có tham số bộ lọc được sử dụng để chỉ định bộ lọc tìm kiếm.multiple = trueđược sử dụng vì chúng tôi muốn trả lại tất cả danh bạ từ thiết bị. Cácfield chìa khóa để tìm kiếm danh bạ bằng displayName vì chúng tôi đã sử dụng nó khi lưu liên hệ.

Sau khi các tùy chọn được thiết lập, chúng tôi đang sử dụng findphương pháp để truy vấn danh bạ. Thông báo cảnh báo sẽ được kích hoạt cho mọi liên hệ được tìm thấy.

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

Khi chúng ta nhấn FIND CONTACT , một cửa sổ bật lên cảnh báo sẽ được kích hoạt vì chúng tôi chỉ lưu một địa chỉ liên hệ.

Bước 3C - Chức năng gọi lại (xóa)

Trong bước này, chúng ta sẽ sử dụng lại phương pháp find nhưng lần này chúng ta sẽ đặt các tùy chọn khác nhau. Cácoptions.filter được thiết lập để tìm kiếm Test Usermà phải được xóa. SaucontactfindSuccess chức năng gọi lại đã trả lại liên hệ mà chúng tôi muốn, chúng tôi sẽ xóa nó bằng cách sử dụng remove phương thức yêu cầu gọi lại thành công và lỗi của riêng nó.

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

Bây giờ, chúng tôi chỉ có một liên hệ được lưu trữ trên thiết bị. Chúng tôi sẽ thêm một thủ công nữa để hiển thị cho bạn quá trình xóa.

Bây giờ chúng ta sẽ nhấp vào DELETE CONTACT nút để xóa Test User. Nếu chúng tôi kiểm tra lại danh sách liên hệ, chúng tôi sẽ thấy rằngTest User Không tồn tại nữa.