Question

这是我在controller.js中使用的模态弹出窗口。我只想在按钮点击时调用在同一个控制器中定义的函数send（）。但是ng-click在modalpopup中不起作用。

$scope.sendMessage = function(order_id) { 
        var modalInstance = $uibModal.open({
            template: '<div id="order-flow-modal" class="inmodal">' +
                    '<div class="modal-header">' +
                    '<h4 class="modal-title">Order Description</h4>' +
                    '<small class="font-bold"></div>' +
                    '<div class="modal-body"><textarea name="message" ng-model="formData.message"  style="width:100%;"></textarea></div><div style="clear:both;"><input type="text" ng-model="formData.order_id" value="'+order_id+'"></div>' +
                    '<div class="modal-footer">' +
                    '<a class="btn btn-success" ng-click="send()">Send</a>' +
                    '<button type="button" class="btn btn-white" ng-click="cancel()">Close</button>' +
                    '</div>' +
                    '</div>',
            windowClass: "animated flipInY",
            controller: ModalInstanceCtrl,
            backdrop: true
        });
        modalInstance.opened.then(function() {

        });
        modalInstance.result.then(function() {

        }, function() {

        });
        return false;
    };

以下是我的发送（）。

$scope.send = function() { 
        alert('hi');
        return false;
    };

Answer 1

您可以通过解析配置参数为模态控制器提供功能。

或者您可以将已定义发送功能的现有范围提供给模态。

$uibModal.open({
...
    scope: $scope
...
})

Answer 2

您可以在此处使用broadcast和on事件发送器。

从ModalInstanceCtrl广播并在当前控制器中收听。

您当前的控制器，

  allControllers.controller('myController', ['$scope','$rootScope',
    function($scope,$rootScope) {
        $scope.sendMessage = function(order_id) { 
                var modalInstance = $uibModal.open({
                    template: '<div id="order-flow-modal" class="inmodal">' +
                            '<div class="modal-header">' +
                            '<h4 class="modal-title">Order Description</h4>' +
                            '<small class="font-bold"></div>' +
                            '<div class="modal-body"><textarea name="message" ng-model="formData.message"  style="width:100%;"></textarea></div><div style="clear:both;"><input type="text" ng-model="formData.order_id" value="'+order_id+'"></div>' +
                            '<div class="modal-footer">' +
                            '<a class="btn btn-success" ng-click="send()">Send</a>' +
                            '<button type="button" class="btn btn-white" ng-click="cancel()">Close</button>' +
                            '</div>' +
                            '</div>',
                    windowClass: "animated flipInY",
                    controller: ModalInstanceCtrl,
                    backdrop: true
                });
                modalInstance.opened.then(function() {

                });
                modalInstance.result.then(function() {

                }, function() {

                });
                return false;
        };

        $scope.$on('send_called', function(event, args) {

        alert('Hi')

        });
     }])

ModalInstanceCtrl：

allControllers.controller('ModalInstanceCtrl', ['$scope','$rootScope',
    function($scope,$rootScope) {

    $scope.send = function() { 
        $rootScope.$broadcast('send_called');
        return false;
    };
    }])

如果在调用send方法后广播，则可以在当前控制器中接收

Refer this link

如何从模态弹出窗口中调用controller.js中定义的函数

2 个答案: