模态内容在打开后替换？ 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引导

回答

相关问题