Jquery 如何在BootstrapDialog.show（{}）弹出窗口中传递参数_Jquery_Angularjs_Twitter Bootstrap 3_Bootstrap Modal_Ngx Bootstrap Modal

Jquery 如何在BootstrapDialog.show（{}）弹出窗口中传递参数

jquery angularjs twitter-bootstrap-3

Jquery 如何在BootstrapDialog.show（{}）弹出窗口中传递参数,jquery,angularjs,twitter-bootstrap-3,bootstrap-modal,ngx-bootstrap-modal,Jquery,Angularjs,Twitter Bootstrap 3,Bootstrap Modal,Ngx Bootstrap Modal,我正在使用BootstrapDialog显示一个弹出窗口。我想传递一个参数。我正在使用数据属性。我的代码是： BootstrapDialog.show({ closable: false, title: "This is my popup", message: $('<div></div>').load(url), data: $('#divResourcePlanName').text($scope.ResourcePlanDet

我正在使用BootstrapDialog显示一个弹出窗口。我想传递一个参数。我正在使用数据属性。我的代码是：

BootstrapDialog.show({
     closable: false,
     title: "This is my popup",
     message: $('<div></div>').load(url),
     data: $('#divResourcePlanName').text($scope.ResourcePlanDetail.ResourcePlan.Name)
});

BootstrapDialog.show({
可关闭：错误，
标题：“这是我的弹出窗口”，
消息：$（''）.load（url），
数据：$（'#divResourcePlanName'）.text（$scope.ResourcePlanDetail.ResourcePlan.Name）
});

我仍然无法在我的HTML中获取

$scope.ResourcePlanDetail.ResourcePlan.Name

值。

您需要一个函数才能使其正常工作<代码>数据需要一个对象。您不需要在此处使用

数据

，即可使其正常工作。您应该完全避免DOM绑定。仅在指令中使用DOM绑定

什么是指令？ 在高层，指令是DOM元素（如属性、元素名称、注释或CSS类）上的标记，它们告诉AngularJS的HTML编译器（$compile）将指定行为附加到该DOM元素（例如通过事件侦听器），甚至转换DOM元素及其子元素

看法

您应该为此创建一个指令。

<!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>

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),
          });
        });
      })
    }
  }
});