角JS - 吳重複問題

我定義爲顯示我的數組：角JS - 吳重複問題

$scope.tt= [ 
    { 
    "name" : "1", 
    "sel" : false 
    }, 
    { 
    "name" : "2", 
    "sel" : false 
    }, 
    { 
    "name" : "3", 
    "sel" : false 
    } 
];

在我看來，顯示像這樣：

<div ng-repeat="mod in tt" ng- class="t text-center"> 
    <img src="images/tt/{{mod.name}}.png"/> 
    <span class="tt">{{mod.name}}</span> 

    <div class="overlay" ng-show="mod.sel"> 

     <div class="range-slider" data-slider data-options="start: 1; end: 10;"> 
     <span class="range-slider-handle" role="slider" tabindex="0"></span> 
     <span class="range-slider-active-segment"></span> 
     <input type="hidden"> 
     </div> 

     <button>Ok</button> 
     <button>Cancel</button> 
    </div> 


</div>

它的工作原理，並顯示我的三個項目名稱和相關的圖像，而且隨後的錯誤：

GET http://localhost:63342/tt/images/tt/%7B%7Bmod.name%7D%7D.png 404（未找到）

彷彿第ere是4項而不是3？

這是什麼原因造成的？

來源

2015-02-11 LmC

發生此錯誤是因爲您的src在角度踢入和插入變量之前由瀏覽器加載。這意味着{{mod.name}}正在被逐字解釋，並導致404當您嘗試加載它的URL。

您應該改用ng-src。 https://docs.angularjs.org/api/ng/directive/ngSrc

來源

2015-02-11 14:15:44 Gazler

您應該看到約3個錯誤，每個項目一個。

原因是您使用src而不是ng-src，因此瀏覽器立即嘗試獲取圖像。更改爲：

<img ng-src="images/tt/{{mod.name}}.png"/>

來源

2015-02-11 14:15:51

角JS - 吳重複問題

回答

相關問題