angularjs - Loading a list from API with Angular (ng-repeat), then add some additional information with jQuery -


i asked before , didn't answer. time around i'll try explain better.

so basically, i'm loading list of formula 1 constructors ergast api. because api not offer information want, such constructor foundation years, have use jquery add them.

the html markup pretty simple. tag dynamic content, , empty tag foundation year.

<div id="constructors" ng-repeat="constructor in constructors">    <img src="img/flags/{{constructor.nationality}}.png" />    <h2 id="constructor">{{constructor.name}}</h2>    <h3 id"foundyear"></h3> </div> 

i know following jquery work, if there 1 element:

$(document).ready(function(){   if ($('#constructor').is(":contains('mclaren')")) {     $('#foundyear').append('1963');   } }); 

i don't know how approach since i'm still quite new javascript. here's picture understand i'm trying do.

enter image description here

can not use ng-if put in information inside repeat?

<div id="constructors" ng-repeat="constructor in constructors">    <img src="img/flags/{{constructor.nationality}}.png" />    <h2 id="constructor">{{constructor.name}}</h2>    <h3 ng-if="constructor.name == 'mclaren'" id="foundyear">1963</h3> </div> 

or similar.

you use name part of id of h3 , access item directly

<...id="foundyear-{{constructtor.name}}"....> 

jquery('#foundyear-mclaren').append...

if have bunch of years put in various items should augment received data in controller add year field , use

{{constructor.year}}

, fill in whichever ones have year.


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -

jquery - Keeping Kendo Datepicker in min/max range -