AngularJs - why is $emit not working from my popup window

Question

I'm using the bootstrap popup modal window, and trying to $emit and event but for some reason the main page is not detecting the event. It's a pretty simple setup, but I can't figure out why. From what I can tell when viewing Batarang it appears the popup is a child scope of the main app scope so I thought it would work but it doesn't. In this simple app when you press 'ok' in the popup window it should set a value in the parent scope. Here's a plunker:

http://plnkr.co/edit/F2W1LaWSsqinaFpiISAr?p=preview

//Here's code where $emit is called in the child (Factory):
var modalInstance = $modal.open({
                templateUrl: 'popupMyWindow.html',
                pScope: parentScope,
                controller: 
                    function($scope, $modalInstance){
                        $scope.ok = function () {
                            $scope.$emit('ModalSelect', 'hello world');
                            $modalInstance.close(null);
                        }
                    },

//Here's where $on is called in the main controller:
 $scope.$on('ModalSelect', function (event, selected) {
            console.log('ModalSelect called successfully');
            $scope.selectedValue = selected;
        });

谢谢！

Answer 1

我不确定传递$scope给服务是否是一个好主意。$scope非常上下文到其被放置在视图中，所以你真能知道你是否应该$emit还是$broadcast？另外，通过时进行单元测试更加困难$scope。而是传递一个回调函数。

话虽这么说，你调用$emit一个$modal指令的范围，这可能是一个孤立的范围（我不知道该指令是如何定义的），所以它永远不会到达父。

因此，您可以执行以下操作：

parentScope.$emit('ModalSelect', 'hello world');

或者，您可以使用$rootScope：

$scope.$root.$broadcast('ModalSelect', 'hello world');