Angularjs - set value ng-click inside ng-repeat on an item -


i load quite few videos on page, youtube. want replace div placeholder, , request video when user clicks on placeholder image.

i got part working loads video on ng-click, loads of them, obviously. how load 1 clicked?

here's html inside ng-view , ng-repeat:

        <figure class=" img-responsive">            <iframe width="320" height="180" ng-src="{{item.videourl | trusted }}"           frameborder="0" allowfullscreen="false" autoplay="0" ng-if="doplay">          </iframe>                    <img ng-src="images/logos/videoplaceholder.jpeg" height="180"           class="img-responsive" ng-if="!doplay" ng-click="setplay()" />        </figure>        <script>         $scope.setplay = function (){          $scope.doplay = true;      }      </script>

like said, above works, loads videos @ once. need load 1 clicked. thanks!!

i don't see ngrepeat, simplest way this:

<figure class="img-responsive" ng-repeat="item in items">   <iframe width="320" height="180" ng-src="{{item.videourl | trusted }}" frameborder="0" allowfullscreen="false" autoplay="0" ng-if="item.doplay"></iframe>   <img ng-src="images/logos/videoplaceholder.jpeg" height="180" class="img-responsive" ng-if="!item.doplay" ng-click="item.doplay = true" /> </figure> 

and skip controller method. sets property on each item in collection.


Comments