离子幻灯片：附加一个带有角度范围变量绑定的新幻灯片答案

【问题标题】：Ionic Slides: append a new slide with angular scope variables binding离子幻灯片：附加一个带有角度范围变量绑定的新幻灯片
【发布时间】：2017-04-07 22:02:09
【问题描述】：

我有一个用例，我想在特定承诺得到解决后动态地将幻灯片附加到 Ionic 滑块。

将纯 HTML 文本附加到 Slider 非常简单。但是，当我尝试使用 {{ }} 从我的控制器绑定 angular variables 时，它们不会得到处理。请参考上面的plunker demo 来理解我的意思。有什么办法可以附加幻灯片，也可以使用控制器范围变量？

作为一种解决方法，我尝试了ng-repeat，而不是附加一张新幻灯片。这是另一个 Plunker 显示：http://embed.plnkr.co/CL9P4I/?show=preview

在这个解决方案中，我想我无意中发现了一个新错误。这里的第二个幻灯片页面没有正确遵循那里提到的 CSS 样式。第一次滑动滑块后，它会恢复正常行为。看看Plunker 以获得清晰的想法。

【问题讨论】：

【解决方案1】：

编辑：工作 Plunker https://plnkr.co/edit/wKsaRJ?p=preview

您需要创建一个数组或对象，以便ng-repeat 使用您的数据传递。喜欢：

$scope.mySlides = ["test1", "test2", "test3"];

并在您的<ion-slide-page> 中使用ng-repeat。喜欢：

<ion-slide-page ng-repeat="slide in mySlider">{{ slide }}</ion-slide-page>

编辑您的 Plunker 我成功地进行了这些更改并工作了。

【讨论】：

感谢您的及时答复。这绝对可以成功。但正如我在问题中提到的，$scope.mySlides 数组必须在承诺解决后更新（为简单起见，我使用了 $timeout）。这会导致幻灯片轻微失真。在这个 plunker 中可以看到：embed.plnkr.co/CL9P4I/?show=preview