0

我是 Angular 的新手（我必须在我以前的同事之后编辑一个项目）。

我已经定义了 FormController 和 ModalController。ModalController 定义如下：

angular.module('app', [...]).controller('ModalController', ['part', class {
    constructor(part) {
       this.part = part;
    }
}]);

在 FormController 我有以下代码来打开模式：

openModal(template, part) {
    this.$uibModal.open({
        animation: true,
        templateUrl: template + '.html',
        controller: 'ModalController',
        controllerAs: 'ModalCtrl',
        resolve: {
            part: () => {
                return something;
            }
        }
    });
}

我的问题是关闭模式（单击视图中的按钮后）。

4

3 回答 3

2

您可以通过这种方式将模态实例传递给控制器​​：

angular.module('app', [...]).controller('ModalController', ['part', '$uibModalInstance', class {
    constructor(part, $uibModalInstance) {
       this.part = part;
    }
}]);

正如 Callum 所说，使用dismiss()和close()函数$uibModalInstance来关闭模态实例。

于 2017-01-20T11:34:25.947 回答
1

您需要将依赖项$uibModalInstance注入到 Modal 的控制器中。

然后，您可以使用$dismiss或$close如从UI Bootstrap Docs中获取的示例所示：

  $ctrl.ok = function () {
    $uibModalInstance.close($ctrl.selected.item);
  };

  $ctrl.cancel = function () {
    $uibModalInstance.dismiss('cancel');
  };

由于您的控制器被实例化为part您将使用它并假设您不需要传递结果或原因，您也可以从方法中删除这些参数：

  part.ok = function () {
    $uibModalInstance.close();
  };

  part.cancel = function () {
    $uibModalInstance.dismiss();
  };

如果您看到$uib使用了前缀的东西，也请注意，这意味着它是Angular UI Bootstrap组件的一部分，希望这些知识有助于您将来搜索所需的更多信息。

于 2017-01-20T10:52:49.463 回答
0

您必须将 uib-modal 的实例注入到包含 close 方法的 modal 控制器中。您可以使用它来关闭模式。

openModal(template, part) {
    var modalInstance = $uibModal.open({
        animation: true,
        templateUrl: template + '.html',
        controller: 'ModalController',
        controllerAs: 'ModalCtrl',
        resolve: {
            part: () => {
                return something;
            }
        }
    });
}

将 modalInstance 注入模态控制器，然后您可以使用

modalInstance .close()

关闭模态的方法。

于 2017-01-20T10:52:08.800 回答