javascript - 为什么 ng-repeat 不接受来自自定义指令链接函数内的 eventListner 的数据？

Question

我正在开发表单构建器，我的应用程序需要拖放功能。我正在为可放置区域使用自定义指令，并为 eventlistner 使用两种方式的数据绑定。但问题是我无法使用 ng-repeat 从 eventlistener 中的数组呈现数据。我通过在 eventlistner 之外输入一个示例数组进行检查，它运行良好。任何人都可以帮助我吗？

app.directive("droppable", function () {
return {
restrict: "EA",
scope: {
  contents: "=ngModel",
},
template: ` <div class="element-divs" ng-repeat="element in elements track by $index">
{{element}}</div>`,

link: function (scope, element) {
  var el = element[0];
  if(!Array.isArray(scope.elements) )scope.elements= [];
  
  el.addEventListener("dragover", function (e) {
    if (e.preventDefault) e.preventDefault();
  });

  el.addEventListener("drop", function (e) {
    var item = document
      .getElementById(e.dataTransfer.getData("Text"))
      .cloneNode(true);
    if (item.id == "email-box") {
      var email = document.createElement("input");
      email.type = "email";
      email.className = "emailer";
      scope.elements.push(email);
    }
    else if (item.id == "text-box") {
      var text = document.createElement("input");
      text.type = "text";
      text.className = "texter";
      scope.elements.push(text);
    }
    console.log(scope.elements);// this logs an array in which everytime drop happens an element is added.
  });
},
};
});