Hi, I apologize if this question sounds a bit obvious but I am still learning ionic. I am trying to call a function within ion-content while I bind the data but clearly there is something I am not doing right. This is what I am trying to do:
<ion-content has-header="true" ng-controller="MyNewsCtrl" ng-init="init()">
<ion-list>
<ion-item ng-repeat="entry in entries" type="item-text-wrap" href="#/view/{{newsId}}">
<img src="fixUrl(entry.content)">
<h2>{{entry.title}}</h2>
<h4>{{entry.publishedDate}}</h4>
<p><span ng-bind-html="entry.contentSnippet"></span></p>
</ion-item>
</ion-list>
</ion-content>
In my controller I have the following function:
$scope.fixUrl = function (url) {
var content_url = url.match(/http([^">]+)/g);
var imageUrl = content_url.toString().split(/[, ]+/).pop();
return imageUrl;
}
The entry.content value I am expecting looks something like this:
"<p><a href=\"http://domain.com/test.html\"><img src=\"http://another.domain.com/images/1234.jpg\" width=\"120\" height=\"86\"></a>texttexttext</p><br>";
After I run it with url.match(/http([^">]+)/g); I get "http://domain.com/test.html,http://another.domain.com/images/1234.jpg"
Ultimately my goals is to get only the image URL, that is why I split the value using pop to get this: http://another.domain.com/images/1234.jpg
In conclusion, my final output should be this:
<ion-content has-header="true" ng-controller="MyNewsCtrl" ng-init="init()">
<ion-list>
<ion-item ng-repeat="entry in entries" type="item-text-wrap" href="#/view/1">
<img src="**http://another.domain.com/images/1234.jpg**">
<h2>title test</h2>
<h4>Monday</h4>
etc...
</ion-item>
</ion-list>
</ion-content>
I read that I could use factory for this or service or event a directive but still I don’t understand the syntax. With JavaScript alone is simple as I just need to create the function and return the value from it. But doing that inside the controller doesn’t return anything. Thanks a lot.