为什么ng repeat不在自定义指令的链接函数中接受来自eventlistner的数据?

oipij1gg  于 2021-09-29  发布在  Java
关注(0)|答案(0)|浏览(176)

我正在使用formbuilder,我的应用程序需要拖放功能。我对可拖放区域使用自定义指令,对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.
  });
},
};
});

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题