$ scope。$ apply()没有更新父范围。这是一个约束性问题吗?

时间:2016-02-17 19:16:15

标签: angularjs

也许这是一种糟糕的方式,所以我愿意改变它。

我正在通过<drag-item>指令和<drop-target>指令实现拖放功能。 <drop-target>指令在父作用域中成功调用此函数:

$scope.testAddSet = function(){
    console.log($scope.workoutItem); // gives me the last value
    $scope.thisMonth[0].sets.push($scope.workoutItem);
    $scope.$apply(); // needed to update the view, but uses the old value for workoutItem "test"
}; 

$scope.workoutItem = "test"; // value declared here

但我的<drag-item>指令似乎没有更新$scope.workoutItem

的值

查看:

<div ng-repeat="exercise in exercises">
   <drag-item workout-item="workoutItem" exercise="exercise"></drag-item>
</div>

<drag-item>指令:

angular.module('app.directives.dragItem', [])
  .directive('dragItem', function(){
    return { 
      restrict: 'E',
      scope: {
        exercise: '=', 
        workoutItem: '='
      },
      templateUrl: "templates/dragTile.html",
      link: function(scope, element, attrs){
        element.on('dragstart', function (event) {
          scope.workoutItem = scope.exercise.name; //correctly updates the local scope, but not the parent scope
          console.log(scope.workoutItem); 
        });
      }
    };
  });

如何解决此问题?

1 个答案:

答案 0 :(得分:1)

看起来问题是您在父作用域中定义$scope.workoutItem,然后指令正在指令的作用域级别创建另一个workoutItem属性。为避免这种情况,建议您使用点(。)来定义模型。请尝试类似:

$scope.workout = {item: undefined}

然后在你看来:

<div ng-repeat="exercise in exercises">
   <drag-item workout-item="workout.item" exercise="exercise"></drag-item>
</div>

我认为这可以在不修改指令本身的情况下解决您的问题。