更改json文件后角度工廠返回數據保持不變

Question

我從「cameraData」服務調用camera.json文件並將cameradata服務注入到「CameraController」中。如果我點擊刷新按鈕後更改camera.json，我正在獲取舊數據。任何想法？

.factory（ 'cameraData'，函數（$ HTTP，$ Q，全局變量）{ VAR推遲= $ q.defer（）;

var cameraData = {};  
var contentType = "application/json; charset=utf-8"; 

cameraData.GetItemList = function(){ 
    $('.loader').show(); 
    var senddata ={}; 
    senddata.installedcameraid = "9547857793457943"; 
     $http({ 
     //url: globalVariable.ServerAddress + "Admin_GetCameraPoints", 
     url: globalVariable.Camerafilepath, 
     dataType: 'json', 
     method: "POST", 
     data: JSON.stringify(senddata), 
     headers: { 
      "Content-Type": contentType, 
      "access_token": globalVariable.TOKEN 
     } 

    }).success(function(response){ 
     //$scope.response = response; 
     deferred.resolve(response); 
     return deferred.promise; 

    }).error(function(error){ 
     //$scope.error = error; 
     deferred.reject(error); 
    }); 


    return deferred.promise; 
} 


return cameraData; 

}）

.controller（」 CameraController」，函數（$範圍，$超時，cameraData）{$ = scope.refreshCameraData函數（）{

$scope.allCamera = []; 
    cameraData.GetItemList() 
    .then(function(data) { 
     $scope.allCamera = data.Camera; 
    }, function(err) { 
     // promise rejected, could log the error 
     console.log('error', err); 
    }); 

} 

cameraData.GetItemList() 
    .then(function(data) { 
     $scope.allCamera = data.Camera; 
    }, function(err) { 
     // promise rejected, could log the error 
     console.log('error', err); 
    }); 

}）

Answer 1

您需要在每次調用工廠方法時創建延遲對象。每次調用api時它都會返回新的promise。用以下方式更改您的工廠代碼。

var cameraData = {}; 
$('.loader').show();   
var contentType = "application/json; charset=utf-8"; 

cameraData.GetItemList = function(){ 
    // need to create defer object everytime 
    var deferred = $q.defer(); 
    $('.loader').show(); 
    var senddata ={}; 
    senddata.installedcameraid = "9547857793457943"; 
     $http({ 
     //url: globalVariable.ServerAddress + "Admin_GetCameraPoints", 
     url: globalVariable.Camerafilepath, 
     dataType: 'json', 
     method: "POST", 
     data: JSON.stringify(senddata), 
     headers: { 
      "Content-Type": contentType, 
      "access_token": globalVariable.TOKEN 
     } 

    }).success(function(response){ 
     //$scope.response = response; 
     $('.loader').hide(); 
     deferred.resolve(response); 
     return deferred.promise; 

    }).error(function(error){ 
     //$scope.error = error; 
     $('.loader').hide(); 
     deferred.reject(error); 
    }); 


    return deferred.promise; 
} 


return cameraData; 
}) 

Answer 2

您不需要顯式創建延遲對象並手動解析/拒絕它。 $http()方法本身返回一個承諾，可以直接返回，如下所示。

.factory('cameraData', function ($http, $q,globalVariable) { 
    var cameraData = {}; 
    $('.loader').show();   
    var contentType = "application/json; charset=utf-8"; 

    cameraData.GetItemList = function(){ 
     $('.loader').show(); 
     var senddata ={}; 
     senddata.installedcameraid = "9547857793457943"; 

     return $http({ 
      //url: globalVariable.ServerAddress + "Admin_GetCameraPoints", 
      url: globalVariable.Camerafilepath, 
      dataType: 'json', 
      method: "POST", 
      data: JSON.stringify(senddata), 
      headers: { 
       "Content-Type": contentType, 
       "access_token": globalVariable.TOKEN 
      } 

     }).then(function(response){ 
      $('.loader').hide(); 
     }).error(function(error){ 
      $('.loader').hide(); 
     }); 
    } 

    return cameraData; 
}); 

而且，對於隱藏加載器，你可以使用如下的.finally()方法：

 return $http({ 
      url: globalVariable.Camerafilepath, 
      dataType: 'json', 
      method: "POST", 
      data: JSON.stringify(senddata), 
      headers: { 
       "Content-Type": contentType, 
       "access_token": globalVariable.TOKEN 
      } 

     }).finally(function(response){ 
      $('.loader').hide(); 
     }); 

在您的控制器，您現在可以訪問響應的，

.controller('CameraController',function($scope,$timeout,cameraData){ 

    $scope.refreshCameraData = function(){ 

     $scope.allCamera = []; 

     cameraData 
      .GetItemList() 
      .then(function(response) { 
       $scope.allCamera = response.data.Camera; 
      }, function(err) { 
       // promise rejected, could log the error 
       console.log('error', err); 
      }); 

    } 


    cameraData.GetItemList() 
     .then(function(response) { 
      $scope.allCamera = response.data.Camera; 
     }, function(err) { 
      // promise rejected, could log the error 
      console.log('error', err); 
     }); 
    }) 
})