模態內容在打開後替換？ AngularUI引導

有人可以解釋一下，如果我可以替換一個模式內的內容一旦打開？當特定的websocket事件被激發時，我打開一個模式。模態內容在打開後替換？ AngularUI引導

之後，我得到狀態更新，我想用這些狀態替換模態內容。

我的代碼，以打開一個模式：

var modalInstance = $uibModal.open({ 
    animation: true, 
    template: r.message.description, 
    windowTemplateUrl: 'modal.html', 
    controller: 'ModalController', 
    backdrop: true, 
    size: 'lg', 
    resolve: {} 
});

modal.html：

<script type="text/ng-template" id="modal.html"> 
     <div class="modal-dialog"> 

    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <h4 class="modal-title">Document Reader</h4> 
     </div> 
     <div class="modal-body" uib-modal-transclude> 
     </div> 
     <div class="modal-footer"> 
     </div> 
    </div> 
    </div> 
</script>

r.message.description是一個字符串我從WebSocket的獲得。這就是我需要在模態內部進行替換。

乾杯，

盒飯

來源

2016-09-20 Bento

感謝這兩個答覆，我已經嘗試過他們兩個，但最終我已經使用事件將數據從一個控制器帶到另一個在這種特定情況下。

在MainController我做了

$rootScope.$broadcast("scanFinished", r.message);

，並在ModalController我在聽的事件：

$scope.$on("scanFinished", function(evt, data) { 
    $scope.result = data; 
});

來源

2016-09-26 13:10:22 Bento

下面是一個簡單plunker我已經創建了在那裏你可以看明白如何將數據傳遞到一個模式。

使用決心注入地圖到您的給定ModalController。您可以在解決方案中寫下同樣的文字，或者像我這樣做的更好地使用angular.copy（它只是爲了更清晰的編碼）。

嘗試用我的$scope.name替換r.message.description。然後你打電話給你的控制器（注意它是一個函數），另外還有一個item（你應該使用依賴注入來縮減代碼）。此項可幫助您將數據傳遞到模態，該模態從您的resolve繼承。

來源

2016-09-20 17:07:32

我會盡力讓所有這一切的意義：P你的plunkr工作正常，我會看看我是否可以得到自己的代碼來處理這個問題。我不能只使用$ rootScope將一個變量傳遞給ModalController嗎？ – Bento

任何想法如何將您的plunker與我的Modalservice？ http://kopy.io/UOSav 您正在使用$ scope.open，但我打開使用此服務的模式。 – Bento

您的[UOSav]（http：// kopy。io/UOSav）是404.我沒有使用$ scope.open，而是使用了'angular-ui.bootstrap'的內置$ uibModal.open（）。但更重要的一點是，您的模板不是r.message.description，而應該在您的解決方案中編寫相同的模板，因爲它會將相同的內容傳遞給您的'modal.html'，可以使用'{ {項目}}'。 –

使用這種方法，來渲染靜態模板

template: '<div ng-bind-html="myScopeVar"></div>', 
resolve: { 
    eventTemplate: function(){ 
     return r.message.description; 
    } 
}

和管理模式的控制器內「myScopeVar」。

如果是帶有角度指令的模板，則使用自定義指令，該指令將編譯您的模板。

template: '<div compile-template="myScopeVar"></div>'

要實現編譯模板指令，應該使用$ compile服務。

來源

2016-09-20 17:08:28

模態內容在打開後替換？ AngularUI引導

回答

相關問題