Open modal in another controller with ng-include

I've this issue when I'm trying to open a modal in AngularJS with phonegap.

I'm checking the connection from device, if device is offline, I need to open a modal.

I have this code on my index.html page:

<script type="text/javascript" charset="utf-8" >

    document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {
        var $injector = angular.bootstrap(document, ['sms']);
        var $controller = $injector.get('$controller');
        var scope = $injector.get('$rootScope').$new();
        var DeviceCtrl = $controller("DeviceCtrl", {$scope: scope});
        scope.checkDevice(device.uuid, navigator.network.connection.type);
    }

</script>
...

 <div ng-controller="ModalCtrl" ng-include="'app/partials/modals.html'">

That script call checkDevice function on DeviceCtrl. OK at this point.

DeviceCtrl:

function DeviceCtrl($scope, $window, Device, $rootScope) {

$scope.checkDevice = function (deviceUuid, networkState) {

    if (networkState == 'none') {
        $rootScope.$broadcast('openConectionless');
    }  
}

And my ModalCtrl:

function ModalCtrl($scope) {
$scope.$on('openConectionless', function() {
    angular.element("#conectionModal").modal("show");

});

}

The openConectionless listener is called, but the angular.element("#conectionModal").modal("show"); doesn't affect the modal.

NOTE: If I put the conectionModal div on index.html and call angular.element("#conectionModal").modal("show"); on DeviceCtrl instead of $rootScope.$broadcast('openConectionless'); , the modal open. But I want to move the modal code to another html to make the code clean. So I create the ModalCtrl.

Does anyone can help me?