如何自動刷新iframe的angularjs？

Question

這是代碼（使用Angularjs和服務器運行本地主機）

的index.html

<iframe src="{{Url}}" width="100%" height="500"></iframe> 

app.js

$scope.Url = "http://0.0.0.0:8080/index.html"; 

需要刷新以每30秒 哪有？

Answer 1

我會使用$超時功能。設置一個初始值，然後每隔30秒調用一次重載函數，並增加一個查詢字符串，以免出現緩存問題。如果這不是問題，你可以刪除$ scope.seed的東西。

angular 
    .module('app') 
    .controller('UrlController', UrlController); 

UrlController.$inject = ['$scope', '$timeout']; 

function UrlController($scope, $timeout) { 

    $scope.loadingCounter = 0; 

    $scope.seed = getUtcDate().getTime(); 
    //adding the counter so the url reload isn't cached. 
    $scope.baseUrl = 'http://0.0.0.0:8080/index.html'; 

    $scope.Url = 'http://0.0.0.0:8080/index.html'; 

    $scope.getReloadUrl = getReloadUrl; 
    $scope.onReload = onReload; 

    function onReload() { 
     $scope.loadingCounter++; 
     $scope.Url = $scope.getReloadUrl(); 
     //restart it again. 
     $timeout($scope.onReload, 30000); 
    } 

    function getReloadUrl(){ 
     //create a unique query string 
     var reloadId = $scope.seed + $scope.loadingCounter; 
     return $scope.baseUrl + '?reloadId=' + reloadId; 
    } 

    //start it up 
    $scope.onReload(); 

    //helper function 
    function getUtcDate() { 
     var now = new Date(); 
     var nowUtc = new Date(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), now.getUTCHours(), now.getUTCMinutes(), now.getUTCSeconds()); 
     return nowUtc; 
    } 

} 

Answer 2

您可以使用JavaScript在使用setInterval刷新來源的src ...

<script> 
window.setInterval("reloadIFrame();", 30000); 

function reloadIFrame() { 
document.frames["frameNameHere"].location.reload(); 
} 
</script>