Vivek Singh Vivek Singh - 1 year ago 75
Javascript Question

Unable to display contact photo in phonegap through angularjs

I am able to fetch and display the contact photo from simple html and javascript but when I use angularjs model to display the contact photo, I get an error. Following is my source code :

List where I am trying to display the contact :

<ul class="list">

<li class="item item-thumbnail-left" ng-repeat="contact in contactList">
<img ng-src="{{contact.mphoto}}"/> <!--When I put this path directly ( ie "content://"), I am able to display the image, but when I fetch it from the controller, I am getting error: "unable to read contacts from asset folder" -->
<p >{{contact.number}}</p>


Here is my controller for setting ContactList :

ContactService.find("").then(function(contacts) {
for (var i = 0; i < contacts.length; i++)
if (contacts[i].phoneNumbers !== null)
for (var j = 0; j < contacts[i].phoneNumbers.length; j++)
var img = contacts[i].photos != null ? contacts[i].photos[0].value : "img/default.png";

$scope.contactList.push({name: contacts[i].name.formatted, number: contacts[i].phoneNumbers[j].value, mphoto: img})

Answer Source

Finally after so much struggle I'll be able to find the issue,

Please paste the below lines in your App.js file and problem will get solved and the reason for not showing photo is that Angularjs adds unsafe: before each url if it is not trusted.

 config(['$compileProvider', function($compileProvider) {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download