html5 - angularjs如何把数组里的数据ng-repeat到html对应的位置中？-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

html5 - angularjs如何把数组里的数据ng-repeat到html对应的位置中？

伊谢尔伦 2017-04-17 11:28:15

[HTML讨论组]

487

怎么样可以让bannerurl数组里的图片路径用ng-repeat到html里替换img的路径？
是用来做图片轮播的，由于CSS的限制，要repeat li标签才能够实现有多张图片轮播。但是我现在不知道该怎么样去在repeat

标签时又替换图片路径。求各位前辈指导一下。

HTML：

<li ng-repeat="x in text">
<img src="images/banner.jpg">
</li>

数组如下：

[{
"id": "01",
"imgurl": "images/banner_01.jpg",
 "bannerurl":[{
      "bannerimgurl0": "images/banner_04.jpg",
      "bannerimgurl1": "images/banner_04.jpg",
      "bannerimgurl2": "images/banner_04.jpg",
      "detailsimgurl": "images/banner_05.jpg"
    }],
"title": "安全椅",
"quantity": "10",
"cost": "896",
"status": "0"
}]

伊谢尔伦

小伙看你根骨奇佳，潜力无限，来学PHP伐。

全部回复(1)

PHPz2017-04-17 11:30:15 1楼

虽然不太明白你说的意思，但我猜应该是想这样吧：
js,controller中

function bannerController($scope){
    $scope.banner = [{
    "id": "01",
    "imgurl": "images/banner_01.jpg",
     "bannerurl":[{
          "bannerimgurl0": "images/banner_04.jpg",
          "bannerimgurl1": "images/banner_04.jpg",
          "bannerimgurl2": "images/banner_04.jpg",
          "detailsimgurl": "images/banner_05.jpg"
        }],
    "title": "安全椅",
    "quantity": "10",
    "cost": "896",
    "status": "0"
    }]
}

html中相应的controller下

<p ng-controller="bannerController">
    <ul ng-repeat="(name,url) in banner[0].bannerurl[0]">
        <li>
            <img src="{{url}}">
        </li>
    <ul>
</p>

可以看下文档,这部分是很基础的内容，希望是你想要的效果

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>