angularjs - 您如何在指令范围内访问 ng-repeat 项的子项？

Question

我刚刚开始使用 AngularJS。我想访问我的 ng-repeat 中的 div.item 但它不起作用。

编辑:当我点击 addtime 时，新项目应该根据鼠标的位置定位

当我点击 addTime($event) 时:

• 我在 ng-repeat="t in time"

  中添加了一个新行

• 我可以得到鼠标的位置

• 但我无法将它传递到我刚刚在 ng-repeat 中创建的项目上。我无法更新这个新项目的范围 myLeft。

有办法吗？

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/指令.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[])
    };
  }
 }
});

Answer 1

我找到了一个解决方案:

我将值存储在数组 $scope.time[]

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

然后我使用 t.mouseX

在 ng-repeat 中获取值

<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>