Question

我在运行时创建bootstrap Modal的HTML并将其绑定到body，如下所示。

模态Html

function GetConfirmationModalHtml(HeaderMessage, Message,YesEvent, Noevent) {
        var html = '<div id="clearModal"><div class="modal fade confirmation-modal" id="myModal" data-backdrop="static" role="dialog" style="display:block; opacity:1;">'
+ '<div class="modal-dialog vertcial-center modal-sm">'
+ '<div class="modal-content">'
+ '<div class="modal-header">'

  + '<h4 class="modal-title">' + HeaderMessage + '</h4>'
+ '</div>'
+ '<div class="modal-body">'
  + '<p>' + Message + '</p>'
+ '</div>'
+ '<div class="modal-footer">'
+ '          <button type="button" class="btn btn-default btn-confirmation-yes" ng-click="' + YesEvent + '" data-dismiss="modal">Yes</button>'
+ '          <button type="button" class="btn btn-default btn-confirmation-no" ng-click="' + Noevent + '" data-dismiss="modal">No</button>'
+ '      </div>'
+ '  </div>'
+ '</div>'
+ '</div></div>';

        return html;
    }

Modal有两个按钮，一个是是，第二个是否。在调用函数获取HTML时，我将两个按钮的事件作为参数发送，当我获取HTML时，我使用$compile将其绑定到正文。当我不发送任何对象作为事件参数时，它工作正常。但是当对象被发送时的 ticket.toString（） 它抛出以下错误

错误：[$ parse：syntax]语法错误：令牌'对象'是意外的，期望在[对象]开始的表达式[PlanEventTicket.Events.CancelEditTicket（[object Object]）]的第49列的[]] ]。 http://errors.angularjs.org/1.5.8/ $解析/语法P0 =对象＆安培; P1 =被％20unexpecte ...荷兰国际集团％20％5B％5D％5D＆安培; P2 = 49＆安培; P3 = PlanEventTicket.Events.CancelEditTicket（％5Bobjectbject％5D）及P4 =对象％5D）

当我传递对象时的Btu JSON.stringify（ticket）它会抛出错误。

错误：[$ parse：ueoe]意外结束表达式： PlanEventTicket.Events.CancelEditTicket（{ http://errors.angularjs.org/1.5.8/ $解析/ ueoe？P0 = PlanEventTicket.Events.CancelEditTicket（％7B
at http://localhost:2053/Scripts/js/angular.js:68:12
at AST.peekToken (http://localhost:2053/Scripts/js/angular.js:14574:13)
at AST.object (http://localhost:2053/Scripts/js/angular.js:14515:14)
at AST.primary (http://localhost:2053/Scripts/js/angular.js:14433:22)
at AST.unary (http://localhost:2053/Scripts/js/angular.js:14421:19)
at AST.multiplicative (http://localhost:2053/Scripts/js/angular.js:14408:21)
at AST.additive (http://localhost:2053/Scripts/js/angular.js:14399:21)
at AST.relational (http://localhost:2053/Scripts/js/angular.js:14390:21)
at AST.equality (http://localhost:2053/Scripts/js/angular.js:14381:21)
at AST.logicalAND (http://localhost:2053/Scripts/js/angular.js:14373:21) <button
type =“button”class =“btn btn-default btn-confirmation-yes” NG-点击= “PlanEventTicket.Events.CancelEditTicket（{” ticketid “：25，” 事件ID “：122，” ticketname “：” QWE “ ”quantityavailable“：213， ”tickettypeid“： ”2“， ”amountperticket“：1， ”总金额“：213， ”eventdescription“：” 23" ， “的startDateTime”： “=”” date（1486456200000）=“”“，”enddatetime“：”=“”date（1486470600000）=“” “，”utcstartdatetime“：”=“”日期（1486427400000）=“” “，”utcenddatetime“：”=“”日期（1486441800000）=“” “，”startdate“：”february =“”07 =“”2017“，”starttime“：”02：00 =“” pm“，”enddate“：”february =“”2017“，”endtime“：”06：00 =“” 分”， “minimumticketallowedperorder”：1， “maximumticketallowedperorder”：10 “isactive”：真 “tickettype”： “支付”， “grandtotal”：1213， “$$ hashkey”： “对象：326”， “copyobject” ：{ “ticketid”：25， “事件ID”：122， “ticketname”： “QWE”， “quantityavailable”：213， “tickettypeid”： “2”， “amountperticket”：1， “总金额”：213，“eventdescription “：” 23" ， “的startDateTime”： “=”” 分 “ ”minimumticketallowedperorder“：1， ”maximumticketallowedperorder“：10 ”isactive“：真 ”tickettype“： ”支付“， ”grandtotal“：1213}， ”iseditmode“：真}） ”=“” 数据解雇= “模态” ＆GT;

以下是整个代码。

调用上述函数的函数用于模态HTML

CancelEditTicketConfirmation: function (ticket) {
            var html = GetConfirmationModalHtml('Confirmation', 'Some ticket(s) are in edit mode. Do you want to continue without saving their records ?', "PlanEventTicket.Events.CancelEditTicket(" + JSON.stringify(ticket) + ")", "NoEvent()");
            $('body').append($compile(html)($scope));
            alignModal();
        },

当用户点击是是

时将调用的事件

CancelEditTicket: function (ticket) {
            ticket.TicketName = ticket.copyObject.TicketName;
            ticket.QuantityAvailable = ticket.copyObject.QuantityAvailable;
            ticket.TicketTypeId = ticket.copyObject.TicketTypeId;
            ticket.AmountPerTicket = ticket.copyObject.AmountPerTicket;
            $('#clearModal').remove();
        }

Answer 1

上面的字符串不是有效的字符串，因为在双引号包装的字符串中不能使用未转义的双引号。

请尝试以下操作。

var html = GetConfirmationModalHtml('Confirmation', 'Some ticket(s) are in edit mode. Do you want to continue without saving their records ?', "PlanEventTicket.Events.CancelEditTicket('" + JSON.stringify(ticket) + "')", "NoEvent()");

在创建动态HTML时传递对象会导致错误

1 个答案: