У меня есть следующий угловой контроллер:
.controller('DialogController', function($scope, $mdDialog, $http) {
$scope.status = ' ';
$scope.showAdvanced = function(ev) {
$mdDialog.show({
controller: DialogController,
template: '<md-dialog>' +
' <md-dialog-content>' +
' {{data}}' +
' </md-dialog-content>' +
'</md-dialog>',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose:true
})
function DialogController($scope, $mdDialog) {
$http.get('http://www.example.com/page/test/test?id=10475').success(function(data) {
$scope.data = data;
$scope.closeDialog = function() {
var mainApp = angular.element(document.body).controller();
$mdDialog.hide();
}
}).error(function(data, status, headers, config) {
console.log("Error in retrieving data from server");
});
}
};
});
Я хочу открыть страницу из URL-адреса внутри моего диалога. Я попытался получить страницу, но у меня есть полный HTML-код моей страницы. Как открыть страницу из URL ($http.get
) внутри моего $mdDialog
как если бы это было как iframe?
Я просто сделал это, и это сработало:
<md-dialog-content style="height:568px;width:320px;overflow:scroll;">
<div class="md-dialog-content" id="dialog-content">
<iframe src="http://www.google.com/" frameborder="0" allowfullscreen style="position: absolute;top: 0;left: 0;width: 100%;height: 90%;" align="center"></iframe>
</div>
</md-dialog-content>
Стиль, упомянутый внутри iframe, гарантирует, что вы не получите двойной или две полосы прокрутки внутри всплывающего окна
Самый важный вынос здесь никогда не закрывает iframe следующим образом: <iframe/>
Вместо этого всегда закрывайте так:
<iframe></iframe>
добавьте привязку данных к вашему шаблону 'dialog1.tmpl.html', например dialog1.tmpl.html
...
{{serverTemplate}}
...
и в контроллере только после получения разметки
$http.get('http://www.example.com/page/test/test?id=10475').success(function(data) {
$scope.serverTemplate = data;
...
html
?