尝试访问嵌套的JSON数据时出现错误：[ngRepeat：dupes]

时间：2015-07-16 10:48:53

标签： json angularjs

我有一个角度应用程序，它会对一个PHP脚本进行$http调用，该脚本会回显一个JSON对象。我以前把我的JSON数据直接写在控制器中，但之后我必须在显示它之前添加一些验证，所以我制作了这个PHP脚本。

我使用this tool来检查我的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:。

我不知道发生了什么。

这是我的控制人员：

'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>&nbsp;</p></div>
            <div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p>&nbsp;{{ 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%"
            }
         ]
      }
   ]

3 个答案:

答案 0 :(得分：0)

像这样使用track by index：

ng-repeat="panel in stran.panels track by $index"

答案 1 :(得分：0)

最简单的解决方案是将您的JSON数据包装在array []

中

答案 2 :(得分：0)

发现问题，我的数据]末尾有一个额外的括号，这会造成麻烦。现在我删除了它，我的数据被正确解析，我只需要相应地调整我的视图。

所以数据字符串现在看起来像这样：

{
   "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>&nbsp;</p></div>
        <div class="col-xs-2 cena subheading fotokopirnica-content" ng-show="panel.singleRow"><p>&nbsp;{{ 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>
相关问题
最新问题