Question

我是Angular＆Bootstrap的新手，但不熟悉编程，所以请多多包涵。

我有一个“删除”按钮，试图在Modal中使用该按钮来确认选择。我遇到的问题是模式打开，询问用户“是否删除多个访客？”，但是“表单”（包含“删除”按钮）从未加载。

我从代码库的其他地方得到了这段代码，基本上只是复制并修改了它。我真的很迷路，因为据我所知，我几乎完全复制了代码，只是更改了一些函数名称和路径。

我真的希望我只是错过了一些小东西，而且很快就能解决。我很乐意提供更多信息，只是不确定还需要显示什么。

我已将该指令注入到应用程序中，它看起来像：

angular.module("WT",[
     ...
     "WT.guests.forms.delete_multiple.directive",
     ...
]);

打开所说的模态的函数如下：

$scope.openGuestMassDelModal = function (size) {
        var modalInstance = $uibModal.open({
          animation: true,
          backdrop: "static",
          controller: ["$scope", "wedding",
            function ($scope, wedding) {
              $scope.guestList = guestsToDelete.guests;
              $scope.wedding = wedding;

              $scope.isMobile = function () {
                return UsersService.mobileAndTabletCheck();
              }

              $scope.closeModal = function (reason) {
                $scope.$dismiss(reason);
              };
            }],
          templateUrl: 'v3.4.2/components/guests/modals/delete_multiple/template.html',
          size: size,
          resolve: {
            guestList: $scope.guestList,
            wedding: $scope.wedding
          }
        });
      };

该模式的HTML如下：

    <div>
    <!--For DESKTOP Version-->
    <div ng-show = "!isMobile()">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="closeModal('dismiss')"><span aria-hidden="true">&times;</span></button>
            <h3 class="modal-title text-center"><i class="icon-user-minus"></i>Delete Multiple Guests?(DESKTOP)</h3>
        </div>
        <div class="modal-body">
            <guests.forms.delete_multiple ng-if="guestList && wedding" guestList="guestList" wedding="wedding"></guests.forms.delete_multiple>
        </div>  
    </div>

上述表单的HTML：

    <div>
        <form name="deleteMultiGuestForm">
            <div class="row">
                <div class="col-xs-12">
                    <uib-alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">alertmsg : {{alert.message}}</uib-alert>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <p class="text-center">Are you sure you want to delete multiple guests? (guests/forms/delete_mltiple)</p>
                    <br />
                </div>
            </div>
            <div class="row">
                <div class="col-xs-6">
                    <button class="btn btn-cancel btn-block text-bold" ng-click="cancel()">Cancel</button>
                </div>
                <div class="col-xs-6">
                    <button class="btn btn-danger btn-block text-bold h-40" ng-click="delete(guestList)">Delete</button>
               </div>
            </div>
        </form>
    </div>

表单的JS看起来像：

"use strict";

angular.module("WT.guests.forms.delete_multiple.directive", ["ui.bootstrap", "WT.guests.service"])

.directive("guests.forms.delete_multiple", [function () {
    ...
    <More Code>
    ...
}],
        restrict: "E",
        scope: {
          guestList: "=",
          wedding: "="
        },
        // templateUrl: "v3.4.2/components/guests/forms/delete_multiple/template.html"
        templateUrl: "v3.4.2/components/guests/forms/delete_multiple/template.html"

      };
}]);

模态未打开angularJS引导程序

0 个答案: