我想從URL獲取響應並在視圖中填充，但我沒有看到更新的視圖。幫我解決這個問題。由於獲取響應，但視圖沒有更新 - AngularJS

來源

<!DOCTYPE html> 
<html ng-app="myModule"> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
</head> 
<body ng-init="priceList='promo03'"> 
<div ng-controller="PricingController" > 
    <div ng-repeat="item in finalList track by $index"> 
    <ul> 
     <li>Actual Price: {{item.actualPrice}}</li> 
     <li>Button: {{item.button}}</li> 
     <li>Content: {{item.content}}</li> 
     <li>Description: {{item.description}}</li> 
     <li>Discounted Price: {{item.discountedPrice}}</li> 
    </ul> 
    </div> 
</div> 
<script> 
var myModule = angular.module('myModule',[]); 
myModule.service('bannerService', ['$http', function ($http) { 
    this.getBannerList = function (id, success) { 
     invokeHttp('https://poctest1.firebaseio.com/Pricing/' + id + '.json', success); 
    } 
    var invokeHttp = function (url, callback) { 
     var value = $http({ method: 'GET', url: url }). 
      success(function (data) { 
       callback(data); 
      }).error(function() { 
       callback(null); 
      }); 
      return value; 
    }; 
}]); 

myModule.controller('PricingController',['$scope','bannerService', function($scope, bannerService){ 
    $scope.finalList = []; 
    var finalArray = []; 
    $scope.splitArray= function(){ 
     $scope.array = $scope.priceList.split(","); 
    }; 
    $scope.callService = function(){ 
     for(i = 0; i < $scope.array.length; i++){ 
      //console.log(bannerSupportService.fetch($scope.array[i])); 
      bannerService.getBannerList($scope.array[i], function(banner){ 
      if(banner != null){ 
       finalArray.push(angular.toJson(banner)); 
      } 
      if(i == $scope.array.length){ 
       $scope.finalList = finalArray; 
       console.log('Final'+$scope.finalList); 
      } 
     }); 
     } 
    }; 

    $scope.splitArray(); 
    $scope.callService(); 

}]); 
</script> 
</body> 
</html>

控制檯輸出

Final{"actualPrice":10,"button":"Check Availability","content":"£5 for 6 months, £10 a month for further 6","description":"Fiber broadband","discountedPrice":5}

HTML實際輸出

Actual Price: 
Button: 
Content: 
Description: 
Discounted Price:

HTML期望輸出

Actual Price: 10 
Button: Check Availability 
Content: £5 for 6 months, £10 a month for further 6 
Description: Fiber broadband 
Discounted Price: 5

來源

2015-06-19 Kaushik

$ scope.finalList = finalArray;在這之後使用 - $ scope。$ apply（） –

我已經試過了。我得到這個錯誤代碼：https://docs.angularjs.org/error/$rootScope/inprog?p0=$digest – Kaushik

$ timeout（function（）{ $ scope。$ apply（） }）; –

Final {「actualPrice」：10，「button」：「檢查可用性」，「內容」：「6個月5英鎊，6英鎊每月10英鎊」，「描述」：「光纖寬帶」，「discountedPrice」：5}

這個輸出代表對象而不是數組，假設你等待數組。因此ng-repeat什麼都不打印。應該是這樣的：

[ 
    { 
    "actualPrice": 10, 
    "button": "Check Availability", 
    "content": "£5 for 6 months, £10 a month for further 6", 
    "description": "Fiber broadband", 
    "discountedPrice": 5 
    } 
]

您的服務正常運行，從而修復控制器部分

來源

2015-06-19 05:26:10

謝謝..它幫助我解決了這個問題。更改此行finalArray.push（angular.toJson（banner））;到finalArray.push（橫幅）; – Kaushik

獲取響應，但視圖沒有更新 - AngularJS

來源

控制檯輸出

HTML實際輸出

HTML期望輸出

回答

相關問題