I am facing an issue with AngularJS where I am unable to display JSON data in my HTML. Below is the code I am using:
$('.loading').show();
$scope.posts=[];
$http.get("https://api.basebear.com/json/tables/20a3fb1d-42c7-45cb-9440-2c6d5d10403d/records?apikey=6e954b0a17b74f52b842ec2b0f0d6d0da24ac5ad").
success(function(data) {
$scope.posts=JSON.stringify(data);
console.log("ok" + "data"+ $scope.posts);
}).
error(function() {
$('.loading').hide();
console.log("no" );
alert("Si è verificato un errore!");
});
});
My HTML code is as follows:
<ons-toolbar fixed-style>
<div class="left">
<ons-toolbar-button onclick="menu.toggleMenu()">
<ons-icon icon="ion-navicon" size="28px" fixed-width="false"></ons-icon>
</ons-toolbar-button>
</div>
<div class="center">Prova</div>
</ons-toolbar>
<section style="padding: 10px;">
<ons-row style="padding: 10px 0 20px 0;">
<input type="search" placeholder="Search" class="search-input" ng-model="search">
</ons-row>
<table>
<tr>
<th>Id</th>
<th>Nome</th>
<th>Cognome</th>
<th>Data</th>
</tr>
<tr ng-repeat="post in posts">
<td>{{post.Value}}</td>
<td>{{post.Value}}</td>
<td>{{post.Value}}</td>
<td>{{post.Value}}</td>
</tr>
</table>
</section>
The error I encounter is: Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: post in posts, Duplicate key: string:[, Duplicate value: "[" How can I resolve this issue and display the data correctly?