Question

我的控制器中定义的modalUrl路径有效，但一旦传递给modal指令就为null。以下是我的控制器代码：

//modal open controller
angular.module('app').controller('NewVisitorModalController', function ($scope, $uibModal, $log) {

$scope.animationsEnabled = true;

$scope.open = function (size) {
    var modalInstance = $uibModal.open({
        animation: $scope.animationsEnabled,
        templateUrl: 'template/modal/newVisitorModal.html',
        .
        .
        .

但是当.uibModalWindow中触发ui-bootstrap.js指令时，templateUrl属性（tAttrs.templateUrl）未定义，并且触发了默认模板：

templateUrl: function(tElement, tAttrs) {
      return tAttrs.templateUrl || 'template/modal/window.html';
}

这是一个问题，因为我有多个模态;我正进入（状态 Error: [$compile:tplrt] Template for directive 'uibModalWindow' must have exactly one root element. template/modal/window.html

这是源代码中的错误吗？我知道我在控制器中指定的urlTemplate路径是准确的，因为源代码中的相同路径会打开默认的window.html模板（当只有一个模态调用时）。

以下是我的一个模板的代码，用于进行健全性检查（当我将源名称从/window.html更改为源中的/file.html时，该代码正确呈现）

<div class="modal fade" id="new-visitor-modal" tabindex="-1" role="dialog">
<div ng-controller="NewVisitorModalInstanceController" class="modal-dialog">
    <div class="modal-content new-visitor-modal-content">
        <div class="modal-header new-visitor-modal-header">
            <div class="col-sm-8 col-xs-24 modal-search">
                <label for="search" class="form-label search-label">Select A Visitor</label>
                <input type="text" id="search" class="modal-search-bar form-control search-box" value="Search">
            </div>
            <div class="buttons new-visitor-modal-buttons">
                <a href="#" class="btn btn-default btn-confirm"><span>Add Visitors</span></a>
                <a href="#" class="btn btn-default btn-confirm"><span>Import Group</span></a>
                <a href="#" class="btn btn-default btn-confirm" id="close-modal"><span>X</span></a>
            </div>
        </div>
        <div class="modal-body">
            <div class="newVisitor">
                <table st-table="rowCollecstion" class="table">
                    <thead>
                    <tr>
                        <th class="table-head" st-sort="">First Name</th>
                        <th class="table-head" st-sort="">Last Name</th>
                        <th class="table-head" st-sort="">Company</th>
                        <th class="table-head" st-sort="">Email</th>
                        <th class="table-head" st-sort="">Phone</th>
                        <th class="table-head" st-sort="">Last Visit</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="user in users" ng-click="selectUser(user)">
                        <td>{{user.firstName}}</td>
                        <td>{{user.lastName}}</td>
                        <td>{{user.company}}</td>
                        <td>{{user.email}}</td>
                        <td>{{user.phone}}</td>
                        <td>{{user.lastVisit}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

UI Bootstrap templateUrl未定义

0 个答案: