在控制器中，AngularJS模态对话框表单对象未定义。

11 浏览
0 Comments

在控制器中，AngularJS模态对话框表单对象未定义。

我们有一个页面，打开一个模态对话框，其中包含以下表单。然而，当我们点击应该处理表单操作的控制器时，表单对象是未定义的，我作为一个Angular新手无法理解为什么...

这是父页面控制器，保存打开模态对话框的函数：

app.controller('organisationStructureController', ['$scope', ..., '$modal', function ($scope, ..., $modal) {
    $scope.openInvitationDialog = function (targetOrganisationId) {
      $modal.open({
          templateUrl: 'send-invitation.html',
          controller: 'sendInvitationController',
          resolve: {$targetOrganisationId: function () {
            return targetOrganisationId;
          }
          }
        }
      );
    };
}]);

在这样的页面上：

// 循环组织内部
邀请新成员

邀请对话框的HTML如下：




        
        
        请输入邮箱地址！
        无效的邮箱

应该处理邀请的控制器在其他地方：

app.controller('sendInvitationController', ['$targetOrganisationId', '$scope', ...,
function ($targetOrganisationId, $scope, ...) {
$scope.invitation = {
  // ...
  targetOrganisation: {
    id: $targetOrganisationId
  }
};
$scope.sendInvitation = function () {
  // $scope.invitationForm is undefined
  if ($scope.invitationForm.$invalid) {
    return false;
  }
  // 发送邀请...
};
}]);

那么如何正确将表单作用域传递给控制器呢？

也许我需要将`$modal`注入到`sendInvitationController`中，并将`sendInvitation`函数添加到其中？但是当我这样做时，动作永远不会进入控制器。或者我需要将处理提交操作的函数添加到`$modal.open({...})`中，而不是引用控制器？尽管我更喜欢将sendInvitationController放在自己的文件和作用域中。

感谢任何帮助！

编辑

我们找到了几个有助于我们构建解决方案的东西，也可能对回答问题本身有所帮助：

  1. `$scope.invitation`对象在`sendInvitationController`中不是未定义的，而是保存了正确的数据，而`$scope.invitationForm`仍然未定义。
  2. 在send-invitation.html中，我们可以访问`$scope.invitationForm.$invalid`并在那里进行验证：

所以问题是：为什么在提交时，将`invitationForm`对象绑定到`$scope`失败，而表单模型正确绑定？

0