动态改变内容的更好方法。 AngularJS 1.6答案

【问题标题】：Dynamic change of content better ways. AngularJS 1.6动态改变内容的更好方法。 AngularJS 1.6
【发布时间】：2017-03-20 11:16:46
【问题描述】：

我有提供横幅信息的 REST 服务。我想将此信息用于主页上滑块的动态更改。

所以我只是简单地使用 $http.get 来获取数据，然后进行插值，并使用一些额外的 ng-if 来检查是否有特定数据，以显示或不显示某些元素。

<div class="main-block" ng-if="locale==='ru'">
            <div ng-repeat="slider in restData.result" ng-class="{'active':$first}" class="slide {{ slider.location }}" ng-style="{'background-image':'url({{ slider.url.url }})'}">

                <div class="content-block">

                    <div class="container">
                        <div class="right-block">
                            <h2>{{ slider.text1 }}</h2>
                        </div>
                        <div class="clearfix"></div>
                        <div ng-if="slider.text2 || slider.text3 || slider.text4 || slider.text5" class="offer-block" ng-style="{'background':'rgba({{ slider.color }},0.6)'}">
                            <div class="offer-block__country">{{ slider.text2 }}</div>
                            <div class="offer-block__name">
                                {{ slider.text3 }}
                            </div>
                            <div class="offer-block__days">
                                {{ slider.text4 }}
                            </div>
                            <div class="offer-block__date">
                                {{ slider.text5 }}
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <a ng-if="slider.link" ui-sref="shell.tourShow({url:'{{ slider.link }}'})" class="orange-btn">
                            Подробнее
                        </a>
                    </div>
                </div>
            </div>
        </div>

但我觉得必须有更好的方法来处理这种类型的数据操作，更具可读性和可理解性。你能帮忙找一个吗，或者举个小例子，如何做得更好。

【问题讨论】：

创建一个指令并将你的html分离成指令模板/templateUrl
@BimalDas 我想过这个，但是，正如我所看到的，它只会导致更多的复杂性，因为我提供的代码就像 html 文件中 80% 的整体代码一样。不过谢谢你，我会试着多google一下，按你说的改一下。

标签： javascript html angularjs interpolation

【解决方案1】：

已经比较好了，唯一要改的就是不直接映射到ng-repeat="slider in restData.result"

而是创建一个$scope 之类的变量

$scope.sliders = {};

// in rest request update the local variable with most recent data
// and then use ng-repeat="slider in sliders"

【讨论】：