使用模态从父作用域调用函数(angular)

时间:2017-05-08 18:00:16

标签: javascript angularjs angularjs-scope modal-dialog

我有一个main.controller.js并且在该控制器中,我有一个模态,我想用它来通知用户警告,然后继续应用程序的其余部分。

所以例如...我想从模态

调用我的fileNew函数

main.controller.js:

    $scope.warningModal = function() {
                $modal.open({
                  animation: true,
                  templateUrl: "./modal.html",
                  controller: "modalController",
                });
          };
    $scope.fileNew = function(type, subject, application) {
        newApplication(type, subject, application)
          $state.go('submissions');
        });
      };

main.html中:

<li><a ng-click="warningModal()">New app</a></li>

modal.html:

<div class="modal-body">
  <p>warning message</p>
</div>
<div class="modal-footer clearfix">
  <button class="pull-right btn btn-primary" ng-click="$parent.fileNew()">Continue</button>
</div>

modalController:

$scope.$parent.fileNew();

在控制台中给我一个警告消息,说.. $ scope。$ parent.fileNew不是函数。

任何想法?

编辑:

围绕这个想法再提一个问题......

我有3种不同类型的fileNew应用程序,我想提交...

所以在我的主控制器中.js:

$scope.fileNew = function(type, subject, application) {
        newApplication(type, subject, application)
          $state.go('submissions');
        });
      };
$scope.fileOld = function(type, subject, application) {
        newApplication(type, subject, application)
          $state.go('submissions');
        });
      };
$scope.fileEdit = function(type, subject, application) {
        newApplication(type, subject, application)
          $state.go('submissions');
        });
      };

有什么方法可以通过我点击哪一个模式上的相同继续按钮?

1 个答案:

答案 0 :(得分:2)

在Angular UI Bootstrap的最新版本中,您可以添加scope选项,您可以在其中传递您希望在模态控制器中可用的范围:

$scope.warningModal = function() {
  $modal.open({
     animation: true,
     scope: $scope,
     templateUrl: "./modal.html",
     controller: "modalController",
  });
};

现在您可以在modalController

中调用您的函数
$scope.fileNew(type, subject, application);