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) :
I add a new line in ng-repeat="t in time"
I can get the position of the mouse
But I can't passed it on the item I just created in ng-repeat.
I can't update my scope myLeft of this new item.
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[])
};
}
}
});
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With