ios - ionic 中使用 cordova camera 插件 上传重复图片 不显示
本文介绍了ios - ionic 中使用 cordova camera 插件 上传重复图片 不显示的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
<div class="feedback-row feedback-list-imgs" ng-repeat="item in image_result">
<div class="feedback-list-img" ng-click="changePic(item)">
<!--<img ng-if="item.length" src="{{item}}">-->
<img ng-src="{{item}}" style="width:100%;height:100%;">
<!--<div class="img" style="background: url({{item}});background-size: 100% 100%;"></div>-->
</div>
<div class="img-delete" ng-click="deletePic(item)"><span class="ion-close-circled"></span></div>
</div>
js 调用原生
var data = ['取照片'];
$scope.curPictureIndex = -1;//当前图片索引
SGPlugin.showSelectedView($.proxy(self.onSelectPictureSuccess, self), data);
原生返回
/**图片选择成功，显示图片并存储
**/
$scope.onSelectPictureSuccess = function(imageData) {
var self = this;
var imageDataTmp;
if (self.SGPlugin.isAndroid()) {
imageDataTmp = "data:image/jpeg;base64," + imageData;
} else {
imageDataTmp = imageData;
}
// 存储、置换该图片
var imageResultArray = $scope.image_result;
imageResultArray = _.isEmpty(imageResultArray) ? new Array() : imageResultArray;
if(self.curPictureIndex != -1){
imageResultArray[self.curPictureIndex] = imageDataTmp;
}
else {
imageResultArray.push(imageDataTmp);
}
$scope.image_result = imageResultArray;
$scope.$apply();}
不重复的照片显示没有问题 上传重复的照片 有数据 但是不显示 求原因 报错
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in image_result
解决方案
问题原因是 image_result 数组中对象的数据类型是字符串，因为ng-repeat 不允许集合中存在两个相同 id 的对象,对于数字或者字符串等基本数据类型来说，它的 id 就是它自身的值。因此数组中是不允许存在两个相同的数字的。为了规避这个错误，需要定义自己的 track by表达式。
解决方案：
item in items track by item.id // 业务上自己生成唯一的id
item in items track by $index //或者直接拿循环的索引变量$index来用
另外需要注意的是，如果数组中是存放对象：
HTML 代码片段
<body ng-app="exeApp">
<ul ng-controller="MainCtrl">
<li ng-repeat="user in users">
{{user.name}}
</li>
</ul>
</body>JavaScript 代码
angular.module('exeApp', []).
controller('MainCtrl', ['$scope',
function($scope) {
$scope.users = [
{name: 'fer'},
{name: 'fer'}
]
}]);运行结果：
具体示例，请参考JSBin
这篇关于ios - ionic 中使用 cordova camera 插件 上传重复图片 不显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
