使用ng-include在另一個控制器中打開模式

當我嘗試在電話中使用AngularJS打開模式時，我遇到了此問題。使用ng-include在另一個控制器中打開模式

我正在檢查設備的連接，如果設備處於脫機狀態，我需要打開一個模式。

我有我的index.html頁上的驗證碼

<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'">

該腳本調用上DeviceCtrlcheckDevice功能。好的在這一點上。

DeviceCtrl: 

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

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

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

而且我ModalCtrl：

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

});

}

的openConectionless監聽器被調用，但angular.element("#conectionModal").modal("show");不影響模式。

注：如果我把conectionModal DIV上的index.html和DeviceCtrl，而不是$rootScope.$broadcast('openConectionless');，模態開叫angular.element("#conectionModal").modal("show");。但我想將模態代碼移動到另一個html，以使代碼清潔。所以我創建了ModalCtrl。

有人能幫助我嗎？

來源

2013-03-30 Deividi Cavarzan

嘗試使用'src'屬性'NG-包括SRC =「」應用程序/諧音/情態動詞。 '''' – charlietfl

@charlietfl我把'src ='像你一樣推薦，但是沒有解決問題。 –

'id = conectionModal'是否顯示在瀏覽器控制檯的實時html中？ 'modal'是否已經初始化？如果'id = conectionModal'最初是在DOM中工作的，現在它正在加載AJAX，如果在加載頁面時自動初始化，bootstrap或其他模式插件將不會自動找到它 – charlietfl

我猜你正在使用bootstrap莫代爾插件和模式是自動在頁面加載初始化時，HTML是內index.html的基礎上標記bootstrapdata屬性。

由於ng-include需要AJAX請求，所以當模態插件最初運行時，modal html不存在，所以您的modall從不初始化。

你可以創建一個簡單的指令，將運行初始化代碼和屬性添加到模式標記爲指令

來源

2013-03-30 15:47:23 charlietfl

您的回答是有道理的。但我試圖建立一個像這個博客中的指令：http://www.grobmeier.de/twitter-bootstrap-modal-angular-js-29082012.html#.UVcvEJPkt8E但我真的不知道如何調用模態從控制器，不用按鈕。 –

您是否有一些示例來構建運行incialization代碼的指令？謝謝。 –

看到這個演示....對於基本實現相當簡單http://plnkr.co/edit/Ci90H1kW8KDtaG8oUETZ – charlietfl

使用ng-include在另一個控制器中打開模式

回答

相關問題