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

问题描述

我正在开发一个表单构建器,我的应用程序需要拖放功能。我正在为可放置区域使用自定义指令,并为 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.
  });
},};
});

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)