我正在使用ngBootBox在我的angularJS项目中具有引导模式对话框。但是当我在同一页面中尝试使用不同模板的两个自定义对话框时遇到问题。

 <button class="btn btn-primary" ng-click="view(t)"
                    ng-bootbox-title="<i class='fa fa-eye-opened'></i>Details Ticket"
                    ng-bootbox-custom-dialog
                    ng-bootbox-custom-dialog-template="./templates/modal/view-ticket.html"
                    ng-bootbox-buttons="customDialogButtons"
                    ng-bootbox-options="dialogOptions">
                    <span class="glyphicon glyphicon-eye-opened" aria-hidden="true"></span>
                        View
                </button>

<button class="btn btn-primary" ng-click="edit(t)"
                    ng-bootbox-title="<i class='fa fa-tags'></i>Edition Ticket"
                    ng-bootbox-custom-dialog
                    ng-bootbox-custom-dialog-template="./templates/modal/add-ticket.html"
                    ng-bootbox-buttons="customDialogButtons"
                    ng-bootbox-options="dialogOptions">
                    <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                        Add
                </button>


我有这两个按钮,但似乎第一个按钮的模板URL被第二个按钮覆盖;结果,这两个模态都打开相同的模板,即./templates/modal/add-ticket.html
当我删除第二个按钮时,第一个按预期工作。

这不限于两个模式,我尝试添加更多的模式,它们都将解析为最后一个模式的模板URL,并且所有这些在打开时都将显示相同的内容。

最佳答案

您可以在按钮中使用不同的dialogOptions对象。

$scope.viewDialogOptions= {
  scope: $scope
}

$scope.editDialogOptions= {
  scope: $scope
}


在html中,您可以:

// Button 1
ng-bootbox-options="viewDialogOptions"

// Button 2
ng-bootbox-options="editDialogOptions"


例如,请参见更新的plunker

希望能有所帮助。

关于javascript - ng-bootbox:同一 View 上的多个自定义模态(同一 Controller ),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/48692152/

10-13 04:30