我正在使用 BootstrapDialog 来显示弹出窗口。我想传递一个参数。我正在使用数据属性。我的一段代码是:
BootstrapDialog.show({
closable: false,
title: "This is my popup",
message: $('<div></div>').load(url),
data: $('#divResourcePlanName').text($scope.ResourcePlanDetail.ResourcePlan.Name)
});
我仍然无法在 HTML 中获取 $scope.ResourcePlanDetail.ResourcePlan.Name 值。
最佳答案
您需要一个 directive使其正常工作。 data 需要一个对象。您不需要此处的data 来使其正常工作。你应该完全避免 DOM 绑定(bind)。仅在指令内使用 DOM 绑定(bind)。
What are Directives? At a high level, directives are markers on a DOM element (such as an attribute, element name, comment or CSS class) that tell AngularJS's HTML compiler ($compile) to attach a specified behavior to that DOM element (e.g. via event listeners), or even to transform the DOM element and its children.
查看
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.35.4/css/bootstrap-dialog.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.35.4/js/bootstrap-dialog.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="MyCtrl">
<button my-dialog message="someMessage">
Open dialog
</button>
</div>
</body>
</html>
对话框模板
<h1>{{ message }}</h1>
AngularJS 应用程序
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl', function ($scope) {
$scope.someMessage = 'Hello World';
});
myApp.directive('myDialog', function ($templateRequest, $compile) {
return {
restrict: 'A',
scope: {
message: '='
},
link: function (scope, element, attrs) {
element.on('click', function () {
$templateRequest("dialog.html").then(function(html){
BootstrapDialog.show({
title: 'Say-hello dialog',
message: $compile(html)(scope),
});
});
})
}
}
});
<强>> demo plnkr
关于jquery - 如何在 BootstrapDialog.show({ }) 弹出窗口中传递参数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49387570/