角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 - 吴重复问题

回答

相关问题