Angular JS使用Grunt：使用來自JSON的相對路徑從本地文件夾顯示圖像

因此，我使用的JSON可以返回包含圖片的大量用戶數據。我面臨的問題是，我相信圖像文件夾的相對路徑是正確的，但由於某種原因，它在ng-source="relativePath"而不是圖像中說。我可以得出的唯一結論是路徑是錯誤的，或者我需要爲項目中使用的圖像進行某種導入。Angular JS使用Grunt：使用來自JSON的相對路徑從本地文件夾顯示圖像

<div ng-repeat="results in userInfo.images"> 
    <figure class="img"> 
    <img data-ng-source="{{results.imageUrl}}" ng-alt="{{results.name}}" ng-title="{{results.name}}" /> 
    </figure> 
</div>

我試過源碼，ng-source和data-ng-source。當我在控制檯和圖像src的html中查看時，它顯示相對路徑/images/profilePicture.png。

我的項目具有以下結構：

Repositry Name 
    app 
    css 
    home 
    home.module.js 
    home.tpl.html 
    images 
    profilePicture.png 
    js 
    resources 
    app.js 
    index.html

使用的最佳實踐index.htlm是單頁的應用程序容器。我們正在使用注入index.html容器頁面的home.tpl.html頁面。

我試過直接從index.html - >/images/profilePicture.png以及home.tpl.html - >../images/profilePicture.png切換路徑。

我找不到任何與我的情況相關的帖子，但我相信也許你需要一個app.use或某種注入方法來添加圖像文件夾以便能夠使用？

注：我不知道這是有幫助的。然而，當我運行咕嚕構建，而不是服務於我檢查DIST文件夾和圖像文件夾事實上確實擁有所有的圖像。

任何幫助，爲什麼這是行不通的，非常感謝，因爲我一直在絞盡腦汁，試圖找出爲什麼這不起作用。

非常感謝您，如果您需要更多信息以下的評論，我很樂意將其添加到問題中。在W3School

<img ng-src="{{results.imageUrl}}" ng-alt="{{results.name}}" ng-title="{{results.name}}" />

更多細節：

來源

2016-08-18 L1ghtk3ira

更改<img data-ng-source聲明只使用ng-srcng-src

來源

2016-08-18 19:49:29

哇，我以前用NG-源。謝謝：） – L1ghtk3ira

Angular JS使用Grunt：使用來自JSON的相對路徑從本地文件夾顯示圖像

回答

相關問題