旋转木马滑块不使用角度js控制器

Question

我一直在我的应用程序中使用carousel slider，并且可以正常使用此代码

JS

var app = angular.module('myApp', []);
app.controller('offerCtrl', function ($scope, $http) {   
  $scope.stores = ["Emil", "Tobias", "Linus"];
});

CSHTML

<div class="container" ng-app="myApp" ng-controller="offerCtrl">
    <div class="dynamicTile">         
        <div class="row">
            <div class="col-sm-6 col-xs-6" ng-repeat="x in stores">
                <div id="{{ 'tile' + ($index + 1) }}" class="tile">
                    <a href="#" class="rippler rippler-default">
                        <div class="carousel slide" data-ride="carousel">
                            <!-- Wrapper for slides -->
                            <div class="carousel-inner">
                                <div class="item" ng-repeat="x in stores" ng-class="{'active': $first}">
                                    <img src="~/assets/images/Stores/{{x.StoreId}}/Product/{{y.ProductId}}.png" class="img-responsive" />
                                    <span class="caption"><i class="fa fa-tags"></i>{{y.ProductName}}</span>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>          
        <div class="row " style="">
            <div class="col-sm-12">
                <a href="all-offers.html" class="btn btn-primary btn-lg btn-block" type="submit">Show All</a>
            </div>
        </div>
    </div>
</div>

但是当我更改JS代码以动态获取数据时，carousel停止工作，即图片不滑动。

此jS出现问题

var app = angular.module('myApp', []);
app.controller('offerCtrl', function ($scope, $http) {
  $http.get("..//Home/getOffers")
  .then(function (response) { $scope.stores = response.data; }); 
});

导致问题的原因是什么？