Question

我有一个.cshtml视图，其中包含modaldialog内容的部分。

<div data-ng-controller="paymentsOverviewAppCtrl"
     ng-mvc-pseudoform
     ng-form
     name
     class
     ng-class>
    <script type="text/ng-template" id="paymentsOverviewByInstallation.modalContent">
        <div class="modal-header">
            <h3 class="modal-title">I'm a modal!</h3>
        </div>
        <div class="modal-body">
            Test
        </div>
        <div class="modal-footer">
            <button class="btn btn-primary" ng-click="ok()">OK</button>
            <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
        </div>
    </script>
 etc....

我的ts档案：

 var app = angular.module("app");

interface IPaymentsOverviewScope extends IBaseViewModel {
    model: Models.PaymentsOverview.PaymentsOverviewModel;
    setSort: ($event: Event, field: string) => void;
    isDescending: (sortField: string) => string;
    statusText: (status: boolean) => string;
    loadMorePayments: ($event: Event) => void;
    formattedDate: (jsonDate: string) => Date;
    canLoadMore: boolean;
    loading: boolean;
        openDetail: () => void;
}

class PaymentsOverviewController extends BaseController {

    constructor(
        public $scope: IPaymentsOverviewScope,
        public $location: ng.ILocationService,
        public $element: ng.IRootElementService,
        public $timeout: ng.ITimeoutService,
        public $window: ng.IWindowService,
        public $http: ng.IHttpService,
        public $modal,
        public dataEndpointService: DataEndpointService,
        _) {

        super($scope, $element, _);

        var modalInstanceCtrl = ($scope, $modalInstance) => {
            $scope.ok = () => {
                $modalInstance.close();
            };

            $scope.cancel = () => {
                $modalInstance.dismiss('cancel');
            };
        };

        $scope.openDetail = () => {

            var modalInstance = $modal.open({
                animation: true,
                //template: '<div class="modal-header"><h3 class="modal-title">Im a modal!</h3></div>',
                templateUrl: 'paymentsOverviewByInstallation.modalContent',
                controller: modalInstanceCtrl,
                size: 'lg',
            });

            console.log("templ: " + modalInstance.templateUrl);
        };
    }
}

app.controller("paymentsOverviewAppCtrl", PaymentsOverviewController);

当我使用templateUrl: 'paymentsOverviewByInstallation.modalContent'时，模态无法打开。当我使用template: '<div class="modal-header"><h3 class="modal-title">Im a modal!</h3></div>'时，模态会打开并显示传递的html。为什么它不能与templateUrl一起使用？我在这里查看示例：https://angular-ui.github.io/bootstrap/然后是模态块

我的控制台出错：GET http：//mySite.site.local.be/nl/Orders/paymentsOverviewByInstallation.modalContent？noCache = 1431524276826 404（Not Found）使用MVC和Sitecore

Answer 1

这是某人在代码中被覆盖的东西。这就是为什么它不起作用。

bootstrap ui modal templateUrl无法正常工作

1 个答案: