在AngularJs中API響應之前呈現模板

Question

我正在使用angular-slick庫通過ng-repeat在幻燈片上顯示項目。 我通過異步調用API獲得項目。 我的問題是模板是在API響應之前呈現的。

這是我的控制器

    angular.module('myApp')
  .controller('homepageCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http) {
    $http({method: 'GET', url: 'https://myapi.com/xxxxxx'}).
    success(function(data, status, headers, config) {
            $scope.articlesSlide = data.articles
    });
  }]); 

這是我的模板

<slick infinite="true" dots="true" arrows="true">
          <div ng-repeat="articleSlide in articlesSlide">

          <a href="/{{articleSlide.cat}}/articulo/{{articleSlide.slug}}" class="dentro" title="Ver noticia">
            <div class="imagen"><img ng-src="{{articleSlide.image}}" alt="{{articleSlide.title}}" /></div>
            <div class="texto">
              <div class="inner">
                <div class="cat">{{articleSlide.0.cat}}</div>
                <h2>{{articleSlide.title}}</h2>
              </div>
            </div>
          </a>

          </div>
          </slick>

Answer 1

您需要使用promise，以便等待http調用從服務器獲取響應。 兌現承諾后，只有其應填充articleSlide范圍變量。 在模板中，對articlesSlide變量進行ng-show檢查，以便在該變量為null時不顯示任何內容（直到時間承諾得到解決）

資料：

角度承諾

例