導入圖像打開

我的index.html：導入圖像打開

<body id="body" ng-app="myApp" ng-controller="Main" ng-init="init()"> 
</body> 
<script src="app.js"></script>

我app.js：

var app = angular.module('myApp', []); 

app.controller('Main', ['$scope',function($scope){ 
    $scope.test = 'Hiiii!'; 

    // Init background 
    $scope.init = function() { 
     var rand = Math.floor(Math.random() * 3) + 1 
     var path = "/images/image"+rand+".jpg"; 
     var img = new Image(); 
     var body = document.getElementById('body'); 
     img.onload = function() { 
      body.appendChild(img); 
     }; 
     img.src = path; 
    }; 
}]);

我的init（）函數確實得到執行，但我不知道爲什麼我的圖像沒有按」不要置身於身體上。任何我錯過或忽略的東西？

沒有img標籤顯示了在體內

來源

2015-11-08 ManyQuestions

只有我發現該錯誤是'VAR路徑= 「/圖片/圖像」 +隨機+ 「JPG」;'應該有'rand'，而不是'rand'的http：// plnkr .co/edit/AmrrRi3UgWH6xqlCjBH1？p =預覽 –

我已更正我的錯字。 – ManyQuestions

的原因是因爲圖像不追加，直到它的加載，但它也將不會被加載，直到它的附加。如果要隱藏圖像直到完成加載，請嘗試以下操作：

var img = new Image(); 
var body = document.getElementById('body'); 
img.src = path; 
img.style.visibility = "hidden"; 
img.onload = function() { 
    img.style.visibility = "visible"; 
}; 
body.appendChild(img);

來源

2015-11-08 22:48:47 AlliterativeAlice

-1

問題出在您的路徑上。例如，如果您將url映射到圖像，它就可以工作。看到這個鏈接： http://plnkr.co/edit/gSRn5v2otzYb0U5EPj8W?p=preview

現在

你的問題，我想你需要把這個源：

var path = "./images/image"+rand+".jpg";

或

var path = "../images/image"+rand+".jpg";

這取決於在你的圖片文件夾，並在那裏在文件夾樹中。我想它找不到這個路徑中的圖像。

如果它們都不起作用，請向我們展示您在控制檯日誌中獲得的內容，這將有助於我們給出答案。

希望我幫

來源

2015-11-08 22:55:09 Yalin

導入圖像打開

回答

相關問題