本文介绍了错误:[ngRepeat:dupes] 这是什么意思?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
repeat 指令从 api 输出葡萄酒记录.我有一个工厂函数来提供 wine API,然后在我的控制器中访问
app.factory("Wine", function ($http){var 工厂 = {};//获取葡萄酒factory.getWines = function(){return $http.get("http://www.greatwines.9000.com")}}
控制器:
app.controller("winesCtrl", function($scope, $http, Wine){Wine.getWines().成功(功能(葡萄酒){$scope.wines = 葡萄酒;}).错误(功能(){alert("错误!");});});看法:<h2>酒单</h2><div class="row margin-top-20 wine-container" ng-repeat="wine in wines"><div class="col-sm-3"><img src="{{wine.picture}}" class="img-responsive"/>
<div class="col-sm-9"><div class="margin-top-20"><span class="bold">名称:</span><span>{{wine.name}}</span>
<div><span class="bold">年份:</span><span>{{wine.year}}</span>
<div><span class="bold">葡萄:</span><span>{{wine.grapes}}</span>
<div><span class="bold">国家:</span><span>{{wine.country}}</span>
<div><span class="bold">区域:</span><span>{{wine.region}}</span>
<div><span class="bold">价格:</span><span>{{wine.price}}</span>
<div><span class="bold">{{wine.description}}</span>
<div class="margin-top-20"><a href="#/wines/{{wine.id}}" class="btn btn-default">编辑 Wine</a>
我点击了这个错误,并以典型的模糊"angularjs方式得到了这个:
不允许在转发器中重复.使用track by"表达式来指定唯一键.中继器:酒中的酒,重复键:字符串:e,重复值:e
这是什么意思?葡萄酒与葡萄酒"不同,为什么它认为它是重复的?
解决方案
在 ngRepeat 表达式中存在重复键时发生.禁止重复键,因为 AngularJS 使用键将 DOM 节点与项目相关联.
这意味着 $scope.wines 有一些重复的值.
你也可以参考这篇文章:Angular ng-repeat 错误不允许在中继器中重复."
repeat directive outputing wine records from an api. I have a factory function to serve up the wine API which is then accessed in my controller
app.factory("Wine", function ($http){
var factory = {};
//getWines
factory.getWines = function(){
return $http.get("http://www.greatwines.9000.com")
}
}
Controller:
app.controller("winesCtrl", function($scope, $http, Wine){
Wine.getWines()
.success(function(wines){
$scope.wines = wines;
})
.error(function(){
alert("Error!");
});
});
VIEW:
<h2>Wine list</h2>
<div class="row margin-top-20 wine-container" ng-repeat="wine in wines">
<div class="col-sm-3">
<img src="{{wine.picture}}" class="img-responsive" />
</div>
<div class="col-sm-9">
<div class="margin-top-20">
<span class="bold">Name: </span><span>{{wine.name}}</span>
</div>
<div>
<span class="bold">Year: </span><span>{{wine.year}}</span>
</div>
<div>
<span class="bold">Grapes: </span><span>{{wine.grapes}}</span>
</div>
<div>
<span class="bold">Country: </span><span>{{wine.country}}</span>
</div>
<div>
<span class="bold">Region: </span><span>{{wine.region}}</span>
</div>
<div>
<span class="bold">Price: </span><span>{{wine.price}}</span>
</div>
<div>
<span class="bold">{{wine.description}}</span>
</div>
<div class="margin-top-20">
<a href="#/wines/{{wine.id}}" class="btn btn-default">Edit Wine</a>
</div>
</div>
</div>
I clicked on this error and in typical "vague" angularjs fashion I get this:
Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: wine in wines, Duplicate key: string:e, Duplicate value: e
What does this mean? wine is not the same as "wines" so why does it think it is a duplicate?
解决方案
Occurs if there are duplicate keys in an ngRepeat expression. Duplicate keys are banned because AngularJS uses keys to associate DOM nodes with items.
This means that $scope.wines have some values which are duplicate.
You can also refer this post : Angular ng-repeat Error "Duplicates in a repeater are not allowed."
这篇关于错误:[ngRepeat:dupes] 这是什么意思?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!
08-05 03:18