TypeError：创建附件时在forEach上非法调用

问题描述

试图创建关联模型的附件，但出现错误，不知道如何调试

firefox对未实现接口FormData的对象说'forEach'；

chrome-TypeError：复制时在forEach处非法调用==

（forEach（目的地，函数（值，键）

返回副本（源，emptyObject，stackSource，stackDest）； ）

用于创建附件，使用angularjs-rails-resource https://github.com/FineLinePrototyping/angularjs-rails-resource

表格

.modal-header
  %h3(ng-hide="attachment.id")!= @t('.title_new',attachmentable: "{{'activerecord.models.'+attachment.primaryRelation+'.one'|t}}")
  %h3(ng-show="attachment.id")!= @t('.title_edit')

%form(name="attachmentForm" ng-model-options='{updateOn: "keydown blur select change",debounce: {keydown: 500}}' novalidate ng-controller="AttachmentFormController")
  .modal-body.form-horizontal
    .form-group
      %label.col-sm-3.control-label!= @t('activerecord.attributes.attachment.name')
      .col-sm-9
        %input.form-control(type="text" ng-model="attachment.name" model-errors="attachment.$errors.name" required focus-on="true")

    .form-group
      %label.col-sm-3.control-label!= @t('activerecord.attributes.attachment.file')
      .col-sm-9(ng-show="attachment.file")
        %div(model-errors="attachment.$errors.file")
          %i(file-input-state="attachment.file")
          %span.attachment!= JST.render('attachments/_attachment',model: 'attachment')

          .btn-group.btn-group-sm
            %button.btn.btn-default.remove(ng-click="removeFile()")
              %i.fa.fa-ban
              = @t('actions.remove')

      .col-sm-9(ng-hide="attachment.file")
        %file-input(name="attachment.file" title="#{@t('.upload_file')}" ng-model="attachment.file" file-selected="fileSelected($file)" bootstrap-file-input model-errors="attachment.$errors.file")

  .modal-footer
    %button.btn.btn-primary(ng-hide="attachment.id" ng-show="$can('create',attachment)" ng-click="modal.create()" ng-disabled="attachmentForm.$invalid || modal.$busy")
      %i.fa.fa-spin.fa-spinner(ng-show="modal.$busy")
      != @t('actions.create')
    %button.btn.btn-primary(ng-show="attachment.id && $can('update',attachment)" ng-click="modal.update()" ng-disabled="attachmentForm.$invalid")!= @t('actions.save')
    %button.btn.btn-default(ng-click="modal.cancel()")= @t('actions.close_modal')

ModalController

angular.module('modals').controller 'ModalController',[
  '$scope','$uibModalInstance','$injector','resource','actionName',($scope,$uibModalInstance,$injector,resource,actionName) ->
    ctrl = this

    resourceName = resource.constructor.config.name
    $scope[_.lowCamelize(resourceName)] = resourceCopy = angular.copy(resource)

    ...

    @create = ->
      ctrl.$busy = true
      # here is failure on create
      resourceCopy.create().then((createdResource) ->
        $uibModalInstance.close(createdResource)
      ).finally ->
        ctrl.$busy = false
   
    ....

工厂

angular.module('railsResource').factory 'RailsResourceNotificatorMixin',[
  '$rootScope',($rootScope) ->

    resourceName = (constructor) ->
      _.lowCamelize(constructor.config.name)

    class RailsResourceNotificatorMixin
      @extended: (Resource) ->
        
        ...

        Resource::create = ->
          debugger

          # super is Resource.__super__.create.apply(this,arguments).then(function(resource) {
          # here is failure
          super.then (resource) ->
            $rootScope.$broadcast("#{resourceName(Resource)}-created",resource)
            resource

resourceCopy =
Object { fileName: "sample.pdf",fileSize: 8573,company: {…},primaryRelation: "company",companyId: 121,name: "sdfsf",file: {"$upload": Object { "$$state": {…},success: success(fn),state: "done-ok",… } id: "3243365014180998090"} }

解决方法

事实证明，在angularjs-rails-resource gem中， angular.copy 不想复制带有附件的对象

https://github.com/FineLinePrototyping/dist-angularjs-rails-resource/blob/v2.0.0/angularjs-rails-resource.js#L1461

{
  "id": 201,"ticketId": 133,"creatorId": 63,"importedFromMyCustomer": false,"myCustomerCompanyid": null,"myCustomerCaseId": null,"myCustomerNoteSeqNbr": null,"content": "Veniam asperiores officia numquam...","deletedAt": null,"createdAt": "2020-10-20T16:54:18.000+03:00","updatedAt": "2020-10-23T10:24:59.000+03:00","updaterId": 1,"isModified": true,"attachments": [
    {
      "fileName": "sample.pdf","fileSize": 8573,"file": {
        "$upload": {
          "$$state": {
            "status": 1,"value": {
              "data": {
                "id": "2810473018465773169"
              },"status": 201,"config": {
                "method": "POST","transformResponse": [
                  null
                ],"url": "/uploads","file": {},"headers": {
                  "Accept": "application/json,text/plain,*/*","X-Requested-With": "XMLHttpRequest","X-XSRF-TOKEN": "3fCWvLQU5rcMpc/kQJvKLsrTJeVtdV8bk2w2/lmynHEekEdBY+GqfPNUkanxBz1tE+AP4qgTGBEbr8UaAx/FOA=="
                },"data": {}
              },"statusText": "Created"
            },"processScheduled": false
          },"state": "done-ok","result": {
            "$$state": {
              "status": 1,"value": {
                "id": "2810473018465773169"
              },"processScheduled": false
            }
          },"uploadedFile": {
            "id": "2810473018465773169"
          }
        },"id": "2810473018465773169"
      }
    },{}
  ],"creator": {
    "id": 63,"firstName": "Coralie","lastName": "Brekke","username": "user_pedro_62","email": "[e-mail]","lastSignInAt": null,"currentSignInAt": null,"teamId": 22,"name": "Coralie Brekke","avatarUrl": "/avatars/small/missing.png","teamName": "Prosacco Group 22","enabled": true,"phone": null
  },"$editing": true
}

临时解决方法是覆盖

data = angular.copy(this,{})

到

data = JSON.parse(JSON.stringify(this))