ios - ionic 中使用 cordova camera 插件 上传重复图片 不显示

Question

<p  class="feedback-row feedback-list-imgs" ng-repeat="item in image_result">
      <p class="feedback-list-img" ng-click="changePic(item)">
        <!--<img ng-if="item.length" src="{{item}}">-->
        <img ng-src="{{item}}" style="width:100%;height:100%;">
        <!--<p class="img" style="background: url({{item}});background-size: 100% 100%;"></p>-->
      </p>
      <p class="img-delete" ng-click="deletePic(item)"><span class="ion-close-circled"></span></p>
    </p>
    
    
    
    
    
    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

Answer 1

問題の原因は、image_result 配列内のオブジェクトのデータ型が文字列であることです。ng-repeat では、数値やデータ型などの基本的なデータ型の場合、同じ ID を持つ 2 つのオブジェクトがコレクション内に存在することが許可されないためです。文字列の場合、その ID は独自の値です。したがって、配列内に 2 つの同じ数値が存在することは許可されません。このエラーを回避するには、エクスプレッションによって独自のトラックを定義する必要があります。

解決策:

• items 内の item track by item.id // ビジネス目的で独自の一意の ID を生成します

• items track by $index //またはループインデックス変数 $index を直接使用

もう 1 つ注意すべき点は、オブジェクトが配列に格納されている場合です。

HTML コード スニペット

リーリー

JavaScript コード

リーリー

実行結果:

具体的な例については、JSBin を参照してください

Answer 2

<p class="フィードバック行フィードバックリスト-imgs" ng-repeat="$index による image_result トラックの項目">

ここでこれを変更してみてください。配列の内容が繰り返される場合、Angular の ng-repeat ループ配列はエラーを報告します

Answer 3

エラーの理由は ng-repeat にあります

デフォルトでは、ng-repeat 中に各項目は一意である必要があります。データが重複しているため、このようなエラー メッセージが報告されます。

エラー メッセージにはすでに解決策が示されています。

による追跡を使用してください。 リーリー