CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-ng-repeat
Steffi
Steffi

Reputation: 7057

How do you access a child of ng-repeat item in a directive's scope?

I have just started using AngularJS. I would like to access to a div.item inside my ng-repeat but it doesn't work.

EDIT : When I click on addtime, the new item should be positioned in accordance with the position of the mouse

When I click on addTime($event) :

Is there a way to do that ?

index.html

 <div class="time" addtime ng-click="addTime($event)">
   <!-- ngRepeat: t in time -->
   <div time="" ng-repeat="t in time" class="ng-scope">
       <div class="item" id="item-0" resizable draggable ng-click="click($event)" ng-style="{ width: myWidth, left: myLeft }"></div>
   </div>
   <!-- end ngRepeat: t in time -->
 </div>

js/directive.js

 dragDirectives.directive('addtime', function() {
  return {
  restrict: 'A',
  link: function(scope, element, attr, ctrl) {

  },
  controller: function addtimeCtrl($scope, $element){
    $scope.time = [];
    $scope.addTime = function(event) {
       $scope.time.push($scope.time.length + 1);
       console.log(event.offsetX);
       // How can access to class="item" of the new ng-repeat (scope.time[])
    };
  }
 }
});

Upvotes: 3

Views: 761

Answers (1)

Steffi
Steffi

Reputation: 7057

I found a solution :

I store the value in the array $scope.time[]

 $scope.time = [];
 $scope.addTime = function(event) {
     $scope.time.push(
       {
          mouseX: pos + "px"
       }
     );
 }

Then I get the value in the ng-repeat with t.mouseX

<div class="time" addtime ng-click="addTime($event)">
   <!-- ngRepeat: t in time -->
   <div time ng-repeat="t in time" class="ng-scope">
       <div class="item" ng-style="{ left: t.mouseX }" resizable draggable ng-click="click($event)"></div>
   </div>
   <!-- end ngRepeat: t in time -->
 </div>

Upvotes: 1

Related Questions