モーダルコンテンツを開いた後に置き換えますか？ AngularUI Bootstrap

Question

誰かが、いったんそれが開いたら、私はモーダル内のコンテンツをどのように置き換えることができるのか説明できますか？私は、特定のWebSocketイベントが発生したときにモーダルを開始しています。

このイベントが発生した後、私はステータスの更新を取得し、そのモードのコンテンツをそのステータスに置き換えたいとします。

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から取得した文字列です。それが私がモーダル内部を置き換える必要があるものです。ここで

乾杯、

弁当

Answer 1

両方の回答をお寄せいただきありがとうございます。私はそれらの両方を試してみましたが、最終的にこのイベントではコントローラを使用して別のコントローラにデータを移動しました。メインコントローラで

私は

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

をやってるとModalControllerに私はイベントのために聞いている：

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

Answer 2

あなたがモーダルにデータを渡す方法を理解するために見ることができ、私が作成したサンプルplunkerです。

resolveを使用すると、指定したModalControllerにマップが挿入されます。あなたは決議に同じものを書いてもいいし、angular.copyをもっとよく使うようにすることもできます。

r.message.descriptionを私の$scope.nameに変更してみてください。次にコントローラ（ここではその関数に注意してください）を呼び出し、さらにitem（コードの縮小化のために依存関係注入を使用する必要があります）を呼び出します。このアイテムは、あなたのresolveから同じものを継承するモーダルにデータを渡すのに役立ちます。

Answer 3

使用このアプローチは、静的テンプレートに

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

をレンダリングし、モーダルコントローラ内の "myScopeVar" を管理します。

angleディレクティブのテンプレートの場合は、カスタムディレクティブを使用してテンプレートをコンパイルします。

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

コンパイルテンプレートディレクティブを実装するには、$ compileサービスを使用する必要があります。