动态改变内容更好的方式。 AngularJS 1.6

时间:2017-03-20 11:16:46

标签: javascript html angularjs interpolation

我有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>

但我觉得必须有更好的方法来处理这种类型的数据操作,更易读和易懂。你能帮忙找一个,或举一个例子,说明如何做得更好。

1 个答案:

答案 0 :(得分:0)

已经相对不错了,我唯一要改变的就是不要直接映射到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"