AngularJS問題與HTTP GET導致

我有以下代碼：AngularJS問題與HTTP GET導致

app.controller('carouselCtrl', ['$scope', '$http', function($scope, $http){ 
    $http.get('/app/ajax/get-favs.php').then(function(response){ 
     $scope.slides = response.data; 
    }); 
}]); 

app.directive('slider', function($timeout) { 
    return { 
     restrict: 'AE', 
     replace: true, 
     scope: { 
      slides: '=' 
     }, 
     link: function(scope, elem, attrs) { 
      scope.currentIndex=0; 

      [...] 

      scope.$watch('currentIndex', function(){ 
       scope.slides.forEach(function(slide){ 
        slide.visible=false; 
       }); 
       scope.slides[scope.currentIndex].visible=true; 
      }); 
     }, 
     templateUrl: '/app/includes/slider.html' 
    }; 
});

我的瀏覽器控制檯的回報：

Error: scope.slides is undefined .link/ [...] in line 55 (scope.slides.forEach....)

但如果我寫的$ scope.slides對象改爲手動與$越來越HTTP .get應用程序正常工作。換句話說，我不能從作用域中的指令調用scope.slides對象。

怎麼了？

來源

2017-02-22 Marcelo Forclaz

你可以發佈'slider'和'carouselCtrl'的html嗎？ –

我不太確定爲什麼你要在指令中定義幻燈片;既然你沒有把你的幻燈片傳遞給指令，但檢索它們，對嗎？我有一種輕微的感覺，在http呼叫解決之前，Angular已經消化了你的指令。 – Rob

初始化頁面時，scope.slides尚不存在（=它是undefined）。一旦api調用完成，它只會獲得一個值。在你的指令中添加一個檢查scope.slides的存在：

scope.$watch('currentIndex', function(){ 
    if (!scope.slides) return; // Added row 
    scope.slides.forEach(function(slide){ 
    slide.visible=false; 
    }); 
    scope.slides[scope.currentIndex].visible=true; 
});

來源

2017-02-22 14:14:42 Fissio

AngularJS問題與HTTP GET導致

回答

相關問題