angularjs - Display content from multiple json on to a single div using ng-repeat -


here scenario. have 3 separate json objects. want have 3 object values displayed in single div. i.e (first values of imagelist, headinglist , pricelist in first div , second). trying use ng-repeat 1 shown below. shows error. there other way can achieve this?

<div ng-controller="bannercontroller">     <div ng-repeat="image in imagelist, heading in headinglist, price in pricelist">         <div style="background-image: url({{image.url}}); width: 1000px; height: 320px;">              <h1>{{heading.title}}</h1>              <p>{{price.price}}</p>         </div>     </div> 

below index.html , script.js

index.html

<!doctype html> <html ng-app="myapp">      <head>         <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js">          </script>         <script src="script.js"></script>         <title>angular test</title>     </head>      <body>         <div ng-controller="bannercontroller">             <div ng-repeat="image in imagelist">                 <div style="background-image: url({{image.url}}); width: 1000px; height: 320px;">                         <h1>{{heading.title}}</h1>                  </div>             </div>         </div>     </body>  </html> 

script.js

var myapp = angular.module('myapp', []);  myapp.controller('bannercontroller', function ($scope) {     $scope.imagelist = [{         url: 'some url 1'     }, {         url: 'some url 2'     }];      $scope.headinglist = [{         title: 'title',         subtitle: 'subtitle'     }, {         title: 'title',         subtitle: 'subtitle'     }];      $scope.pricelist = [{         price: 2     }, {         price: 3     }]; }); 

you can values using $index property of ng-repeat.

plunker link


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -