Hi, @Dedoo
Try this:
.html
<div class="container" *ngFor="let contact of contactlist">
<h2 class="name">{{contact.displayName}}</h2>
<p class="number">{{ contact.phoneNumbers }}</p>
</div>
.ts
import { IonicPage, NavController } from 'ionic-angular';
import { Contacts, Contact, ContactField, ContactName } from '@ionic-native/contacts';
@IonicPage()
@Component({
selector: 'page-add-chat',
templateUrl: 'add-chat.html',
providers: [Contacts]
})
export class AddChatPage {
private contactlist: any[];
constructor(public navCtrl: NavController, private contacts: Contacts) {
this.fetchDeviceContact();
}
fetchDeviceContact(){
var options = {
filter : "",
multiple:true,
hasPhoneNumber:true
};
this.contacts.find(["*"],options).then((res) => {
for (var i = 0; i < contacts.length; i++) {
var contact = contacts[i];
var no =contacts[i].name.formatted;
var phonenumber=contacts[i].phoneNumbers;
if(phonenumber != null) {
for(var n=0;n<phonenumber.length;n++) {
var type=phonenumber[n].type;
if(type=='mobile') {
var phone=phonenumber[n].value;
var mobile;
if(phone.slice(0,1)=='+' || phone.slice(0,1)=='0'){
mobile=phone.replace(/[^a-zA-Z0-9+]/g, "");
}
else {
var mobile_no=phone.replace(/[^a-zA-Z0-9]/g, "");
mobile=countrycode+mobile_no;
}
var contactData={
"displayName":no,
"phoneNumbers":mobile,
}
this.contactlist.push(contactData);
}
}
}
}
console.log("contactlist >>>",this.contactlist);
}).catch((err) => {
console.log('err',err);
});
}
}
Thanks.