我尝试开发一个Image-Viewer。我希望能够添加多个图库来包含图像，它应该可以“复制”一个图库。那就是我现在被困住的地方。
我可以添加新的画廊，但不能复制一个。复制时，Gallery会在我的数组中重复，但不会显示。在此之后添加新图库时，它们也不会显示。
我根本不明白。
一些代码：
//Create this prefs to handle notification popup
Map<String, Object> prefs = new HashMap<String, Object>();
prefs.put("profile.default_content_setting_values.notifications", 2);
//Initialize chrome option to add prefs
ChromeOptions options = new ChromeOptions();
options.setExperimentalOption("prefs", prefs);
//Now initialize chrome driver with chrome option to handle notification alert
WebDriver a = new ChromeDriver(options)
a.get("http://www.firstcry.com/");
a.manage().window().maximize();
WebDriverWait wait = new WebDriverWait(a, 30)
//Now find iframe and switch to it
wait.until(ExpectedConditions.frameToBeAvailableAndSwitchToIt("iframe_Login"));
//Now find the popup close button
WebElement b = wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("div[class = '_pop_close _pop_reg_bg']")));
b.click();
//Now switch back from frame to default content for further steps
a.switchTo().defaultContent();
//Now do your further stuff
我做了plunker来显示问题。
感谢任何帮助，谢谢！
答案 0 :(得分：1)
在你的HTML中使用track by $index
ng-repeat="gallery_ in galleries track by $index"
答案 1 :(得分：1)
您尝试将同一个对象添加到imagegalleries（它的引用相同）。一个简单的解决方法是在添加新图库时调用angular.copy()：
this.addImageGallery = function(imagegallery){
imagegalleries.push(angular.copy(imagegallery));
};
这里有更新的Plunkr。
答案 2 :(得分：0)
使用ng-repeat渲染组件时，请查看控制台（Chrome中的F12＆gt;控制台）。
您在那里收到错误：
Error: [ngRepeat:dupes] http://errors.angularjs.org/1.5.7/ngRepeat/dupes?p0=gallery_%20in%20galleri…22%3A0%2C%22images%22%3A%5B%5D%2C%22%24%24hashKey%22%3A%22object%3A6%22%7D
阅读有关此错误的官方文档here：
不允许在转发器中重复。使用＆＃39;跟踪＆＃39;表达到 指定唯一键。转发器：{0}，重复键：{1}，重复 价值：{2}
<强>释
请考虑以下代码段：
您在此片段中进行了2 ng-repeat（即ng-repeat＃1和ng-repeat＃2）。两个ng-repeat都呈现重复。
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
ng-repeat #1
<div ng-repeat="n in [42, 42, 43, 43]">
{{n}}
</div>
<hr>
ng-repeat #2
<div ng-repeat="n in [42, 42, 43, 43] track by $index">
{{n}}
</div>
<script>
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
});
</script>
</body>
</html>
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed.
Use 'track by' expression to specify unique keys.
Repeater: n in [42, 42, 43, 43],
Duplicate key: number:42, Duplicate value: 42
track by时，它可以正常工作。因为您的数组中有重复项，所以您必须在track by中使用ng-repeat来解决该错误，例如：
<section ng-repeat="gallery_ in galleries track by $index">
<div ng-controller="galleryCtrl" ng-init="init(gallery_)" style="margin: auto" >
<div style="width: 90%; height: 40px; margin: auto; border: 1px solid orange;" >
<button ng-click="duplicate()">duplicate me</button>
</div>
<div style="width: 90%; min-height: 150px; margin: auto; overflow-x: auto; white-space: nowrap; border: 1px solid orange;" >
<div ng-repeat="file in gallery.images" style=" display: inline-block; background-color: white; position: relative;" >
<div ng-controller="imageCtrl" ng-init="imageinit(file)" >
<figure id="{{imageitem.id}}" ng-style="imageitem.style" style="width: 200px; height: 200px;">
<figcaption style="color: white">
{{ imageitem.id }}
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</section>