javascript - AngularJS : set parent controller $scope variable from child directive

Question

我有一个主 Controller EventCtrl，它在其范围内设置 formData 变量。

此 Controller 有一个 setEventObject 方法，可以覆盖 formData 对象。

我的目的是能够从子指令调用此方法并将新变量值递归地应用于每个范围。

这是 Controller 及其setEventObject函数:

app.controller('EventCtrl', function($scope) {
  $scope.formData = {
    id: 1,
    name: 'tennis lesson'
  }
  $scope.events = [
    {id: 1, name: 'tennis lesson'}, 
    {id: 2, name: 'golf lesson'}, 
    {id: 3, name: 'handball lesson'}
  ];

  this.setEventObject = function(eventId) {
    angular.forEach($scope.events, function(elem) {
      if (elem.id == eventId) {
        $scope.formData = {
          id: elem.id,
          name: elem.name
        };
      }
    });
  }
});

这是关联的Plunkr ，点击链接时，它应该设置表单输入并重置 formData 变量。

感谢您的帮助!

Answer 1

您正在使用 element.bind('click' 来监听单击。这是 jQuery，这些更改位于 Angular 世界之外。您需要告诉 Angular 您的更改。

将 eventCtrl.setEventObject(scope.event.id); 行替换为

scope.$apply(function () {
    eventCtrl.setEventObject(scope.event.id);
});

我在你的plunker中尝试了上述更改，它按预期工作。