Question

我的情况是，某个特定帖子的图片名称是以字符串形式出现的：像这样：

**"i_name":"logo_v1_300px.png,logo_v1_140px.png,logo_v1_220px.png"**

我需要拆分这个字符串并显示如下（html）：

 <ul>
 <li><a href="#"><img src="images/photo2.png" alt=""></a></li>
 <li><a href="#"><img src="images/photo3.png" alt=""></a></li>
 <li><a href="#"><img src="images/photo4.png" alt=""></a></li> 
 </ul>

我有过滤器分割字符串，如：

  angular.module('myFilters', []).
  filter('split', function() {
   return function(input, delimiter) {
  var delimiter = delimiter || ',';

  return input.split(delimiter);
}

}）;

现在如何显示这些来自拆分的图像：

 <div ng-repeat ="data in comments">

   mydata="{{data.text}}"

  photos
 <ul> 
   <li><a href="#"><img src="somepath"/{{data.i_name | split }}></a></li>
 </ul>
 </div>

我怎样才能做到这一点。这些图像(coming from split string filter)如何以Angular方式循环？

Answer 1

为什么不：

ng-repeat="item in items.split(',')"

Answer 2

为什么不通过在控制器内执行拆分来简化您的问题？

控制器：

var data = {
    "i_name":"logo_v1_300px.png,logo_v1_140px.png,logo_v1_220px.png"
};

$scope.images = data.i_name.split(',');

查看：

<ul>
    <li ng-repeat="image in images">
        <a href="#"><img ng-src="somepath/{{image}}"></a>
    </li>
</ul>

Answer 3

我这样做了。

我有大量数据进入范围。它不只是关于图像。有嵌套对象数据。

<div ng-repeat="image in data.image">
  <ul>
   <li ng-repeat="image in i_name | split ">
     <a href="#"><img ng-src="somepath/{{image}}"></a>
  </li>
 </ul>
</div>

拆分字符串，然后输入ng-repeat？

3 个答案: