У меня есть угловое приложение, которое заставляет $http
получить вызов скрипта php, который перекликается с объектом JSON. Раньше у меня были данные JSON, написанные непосредственно внутри контроллера, но затем я должен был добавить некоторую проверку перед ее отображением, поэтому я сделал этот php-скрипт.
Я использовал этот инструмент, чтобы проверить, действительно ли мои данные JSON действительны. Я вижу данные с firebug (и в моей консоли, так как я console.log
его), и мне это кажется прекрасным, но по какой-то причине я получаю следующее сообщение об ошибке: Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: stran in vsebina, Duplicate key: string:, Duplicate value:
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: stran in vsebina, Duplicate key: string:, Duplicate value:
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: stran in vsebina, Duplicate key: string:, Duplicate value:
Я понятия не имею, что происходит.
Здесь мой контроллер:
'use strict';
angular.module('ZICApp')
.controller('FotokopirnicaController', function ($scope, $http) {
$scope.vsebina = [];
$http.get('http://localhost/ZIC/ip%20test/fotokopirnica.php').
success(function(data) {
console.log(data);
$scope.vsebina = data;
}).
error(function(data) {
console.log(data);
});
});
мой взгляд:
<div ng-repeat="stran in vsebina">
<div class="panel-content">
<div>
<p class="center">{{ stran.greeting }}</p>
<br>
<br>
<p class="fotokopirnica-title">{{ stran.title }}</p>
</div>
</div>
<div class="panel-content">
<div class="row " ng-repeat="panel in stran.panels">
<div class="col-xs-8 subheading fotokopirnica-content"><p>{{ panel.title }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.row1"><p>{{ panel.row1 }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.row2"><p>{{ panel.row2 }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p> </p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p> {{ panel.singleRow }}</p></div>
<div ng-repeat="row in panel.content">
<div class="col-xs-8">{{ row.item }}</div>
<div class="col-xs-2 cena">{{ row.row1 }}</div>
<div class="col-xs-2 cena">{{ row.row2 }}</div>
</div>
</div>
</div>
</div>
ответ запроса GET:
{
"greeting":"Za potrebe sodelavcev IJS tiskamo, fotokopiramo, skeniramo in vežemo dokumente.",
"title":"IJS cenik fotokopiranja",
"panels":[
{
"title":"ČB fotokopiranje",
"row1":"A4",
"row2":"A3",
"content":[
{
"item":"Fotokopija",
"row1":"0,06 €",
"row2":"0,09 €"
},
{
"item":"Fotokopija na barvni papir",
"row1":"0,10 €",
"row2":"0,15 €"
},
{
"item":"Fotokopija vezanega gradiva",
"row1":"0,07 €",
"row2":"0,10 €"
},
{
"item":"Fotokopija na prosojnico",
"row1":"0,65 €",
"row2":"/"
},
{
"item":"Skeniranje",
"row1":"0,10 €",
"row2":"0,10 €"
}
]
},
{
"title":"Barvno fotokopiranje",
"row1":"A4",
"row2":"A3",
"content":[
{
"item":"Fotokopija 80g papir",
"row1":"0,60 €",
"row2":"0,90 €"
},
{
"item":"Fotokopija vezanega gradiva 80g papir",
"row1":"0,70 €",
"row2":"1,00 €"
},
{
"item":"Fotokopija 100g papir",
"row1":"1,00 €",
"row2":"1,50 €"
},
{
"item":"Fotokopija na prosojnico",
"row1":"1,40 €",
"row2":"/"
},
{
"item":"Skeniranje",
"row1":"0,10 €",
"row2":"0,10 €"
}
]
},
{
"title":"Vezave",
"singleRow":" ",
"content":[
{
"item":"Termo vezava do 50 listov",
"row2":"1,13 €"
},
{
"item":"Termo vezava nad 50 listov",
"row2":"1,46 €"
},
{
"item":"Vezava A",
"row2":"1,25 €"
},
{
"item":"Vezava B",
"row2":"1,46 €"
},
{
"item":"Vezava C",
"row2":"1,90 €"
},
{
"item":"Ovitek",
"row2":"0,42 €"
}
]
},
{
"title":"Ostale Storitve",
"singleRow":"ura",
"content":[
{
"item":"Zgibanje na stroju",
"row2":"23,48 €"
},
{
"item":"Ročno delo",
"row2":"21,39 €"
}
]
},
{
"title":"Količinski popusti",
"singleRow":" ",
"content":[
{
"item":"ČB fotokopija, 500-1000",
"row2":"15%"
},
{
"item":"ČB fotokopija, nad 1000",
"row2":"33%"
},
{
"item":"Barvna fotokopija, 80g papir, 25-50",
"row2":"25%"
},
{
"item":"Barvna fotokopija 80g papir, nad 50",
"row2":"40%"
}
]
}
]
Найденная проблема, в конце моих данных была дополнительная скобка ]
, что вызывало проблемы. Теперь, когда я удалил его, мои данные были правильно проанализированы, и мне просто нужно соответствующим образом настроить свое мнение.
Итак, строка данных теперь выглядит так:
{
"greeting":"Za potrebe sodelavcev IJS tiskamo, fotokopiramo, skeniramo in vežemo dokumente.",
"title":"IJS cenik fotokopiranja",
"panels":[
{
"title":"ČB fotokopiranje",
"row1":"A4",
"row2":"A3",
"content":[
{
"item":"Fotokopija",
"row1":"0,06 €",
"row2":"0,09 €"
},
{
"item":"Fotokopija na barvni papir",
"row1":"0,10 €",
"row2":"0,15 €"
},
{
"item":"Fotokopija vezanega gradiva",
"row1":"0,07 €",
"row2":"0,10 €"
},
{
"item":"Fotokopija na prosojnico",
"row1":"0,65 €",
"row2":"/"
},
{
"item":"Skeniranje",
"row1":"0,10 €",
"row2":"0,10 €"
}
]
},
{
"title":"Barvno fotokopiranje",
"row1":"A4",
"row2":"A3",
"content":[
{
"item":"Fotokopija 80g papir",
"row1":"0,60 €",
"row2":"0,90 €"
},
{
"item":"Fotokopija vezanega gradiva 80g papir",
"row1":"0,70 €",
"row2":"1,00 €"
},
{
"item":"Fotokopija 100g papir",
"row1":"1,00 €",
"row2":"1,50 €"
},
{
"item":"Fotokopija na prosojnico",
"row1":"1,40 €",
"row2":"/"
},
{
"item":"Skeniranje",
"row1":"0,10 €",
"row2":"0,10 €"
}
]
},
{
"title":"Vezave",
"singleRow":" ",
"content":[
{
"item":"Termo vezava do 50 listov",
"row2":"1,13 €"
},
{
"item":"Termo vezava nad 50 listov",
"row2":"1,46 €"
},
{
"item":"Vezava A",
"row2":"1,25 €"
},
{
"item":"Vezava B",
"row2":"1,46 €"
},
{
"item":"Vezava C",
"row2":"1,90 €"
},
{
"item":"Ovitek",
"row2":"0,42 €"
}
]
},
{
"title":"Ostale Storitve",
"singleRow":"ura",
"content":[
{
"item":"Zgibanje na stroju",
"row2":"23,48 €"
},
{
"item":"Ročno delo",
"row2":"21,39 €"
}
]
},
{
"title":"Količinski popusti",
"singleRow":" ",
"content":[
{
"item":"ČB fotokopija, 500-1000",
"row2":"15%"
},
{
"item":"ČB fotokopija, nad 1000",
"row2":"33%"
},
{
"item":"Barvna fotokopija, 80g papir, 25-50",
"row2":"25%"
},
{
"item":"Barvna fotokopija 80g papir, nad 50",
"row2":"40%"
}
]
}
]
}
и мой взгляд выглядит так:
<div class="panel-content">
<div>
<p class="center">{{ vsebina.greeting }}</p>
<br ng-show="vsebina.title">
<br ng-show="vsebina.title">
<p class="fotokopirnica-title" ng-show="vsebina.title">{{ vsebina.title }}</p>
</div>
</div>
<div class="panel-content" ng-show="vsebina.panels">
<div class="row " ng-repeat="panel in vsebina.panels">
<div class="col-xs-8 subheading fotokopirnica-content"><p>{{ panel.title }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.row1"><p>{{ panel.row1 }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.row2"><p>{{ panel.row2 }}</p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p> </p></div>
<div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p> {{ panel.singleRow }}</p></div>
<div ng-repeat="row in panel.content">
<div class="col-xs-8">{{ row.item }}</div>
<div class="col-xs-2 cena">{{ row.row1 }}</div>
<div class="col-xs-2 cena">{{ row.row2 }}</div>
</div>
</div>
</div>
Самое простое решение - обернуть ваши данные JSON в массив []
Используйте дорожку по индексу следующим образом:
ng-repeat="panel in stran.panels track by $index"
$scope.vsebina = [];
и затем присвоение ему данных (см. контроллер){
и заканчивается]
какой из них является правильным?