I am new to Angular.JS & are currently working on my first project. I have a page full of entries of the kind
<h1>Title</h1>
<p>Teaser</p>
<p>(a link)</p>The user can click on the link and get to the respective detail page. Here, I already head the same problem, which I could solve by using the ng-bind-html directive as follows:
$scope.shownews = function(id) {
if (typeof id === 'undefined') {
$http({
method: 'GET',
url: 'http://dev.ivm.at/getallnews.php'
}).
success(function(data, status, headers, config) {
$scope.allnews = data;
$scope.myHTML = [];
for (var i = 0; i < $scope.allnews.length; i++) {
$scope.myHTML[i] = $scope.allnews[i].Teaser;
}
});
} else {
$http({
method: 'GET',
url: 'http://dev.ivm.at/getnews.php?ID=' + id
}).
success(function(data, status, headers, config) {
$scope.singlenews = data;
$scope.Newstitel = $scope.singlenews[0].Title
//[...]
$scope.Inhalt = $scope.singlenews[0].Inhalt;
//[...]
$scope.myHTML = "<h1>" + $scope.Newstitel + "</h1><br>" + $scope.Inhalt;
});
}
}<div data-role="page" id="einenews">
<section class="beitrag" ng-bind-html="myHTML">
<article>
<h1>{{Newstitel}}</h1>
<div class="beitrag-img">
<a href="lighbox mit bild"></a>
<img src="" + {{Bilderlink}}>
</div>
<p>{{Inhalt}}</p>
</article>
</section>
</div>For the detail page, an id is passed to the shownews, but the first call is without an id to read all the news from where, the user can reach the detail page by each news link,
I tried to find out how I can use an index in an ng-repeat loop, but couldn't find an answer. Is it possible to find out in HTML how many times the loops executed each time? What I need is something like (in pseudocode):
ng-repeat="news in allnews; count = count + 1;"
or a similar additional tag so that I can use this in a special "myHTMLall".
Thank you for your answer!
EDIT: I modified the code now, but it still does not format the text in the main page with all news:
<div data-role="page" id="allnews">
<div id="sub">
<section class="blog">
<article ng-bind-html="myHTML" ng-repeat="news in allnews">
<h1>{{news.Title}}</h1>
<!-- <p>{{news.Teaser}}</p> -->
<p>{{myHTML[$index]}}</p>
<p class="readmore">
<a href="onenews" ng-click="shownews(news.ID)">
Weiterlesen: {{news.Title}}
</a>
<span class="readmore_icon">
</span>
</p>
</article>
</section>
</div>
</div>
trackis no more anunexpected token? By the way: The solution below using the$indexwithout thetrackworks fine!