Question

我的代码就像这样

    angular.module('RateRequestApp.controllers', []).controller('ReadOnlyController', [ '$scope', '$modal',
    function($scope, $modal) {
        var data = [];
        data.push("first message");
        this.openReprintModal = function() {
            var modalInstance = $modal.open({
                templateUrl: 'ReprintModal.html',
                controller: 'ModalInstanceCtrl',
                resolve: {
                    items: function() {
                        return data;
                    }
                }
            });
        };
        this.openReprintModal();

    }
]);

angular.module('RateRequestApp.controllers').controller('ModalInstanceCtrl', function($scope, $modalInstance) {

    $scope.ok = function() {
        $modalInstance.close();
    };
    $scope.cancel = function() {
        $modalInstance.dismiss('cancel');
    };
});

  <div id="RateRequestApp" class="content" ng-app='RateRequestApp' ng-controller="ReadOnlyController">
 <script type="text/ng-template" id="ReprintModal.html">
                <div class="modal-header">
                    <h3 class="modal-title">Check this out</h3>
                </div>
                <div class="modal-body">
                    <ul>
                        <li ng-repeat="item in items">
                            <span>{{ item }}</span>
                        </li>
                    </ul>
                </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>
        </div>

一切正常除非模态正文中没有显示消息。显然每个人都在工作，除了“

<li ng-repeat="item in items">
        <span>{{ item }}</span>
 </li>`

这部分不起作用。可以指出任何可能的原因。注意：我将这个用于模型：http://angular-ui.github.io/bootstrap/

Answer 1

您必须将 items对象注入ModalInstanceCtrl，如下所示：

angular.module('RateRequestApp.controllers')
  .controller('ModalInstanceCtrl', function($scope, $modalInstance, items) {
    $scope.items = items;
    ...
});

然后您就可以在视图中访问它，就像现在一样

<li ng-repeat="item in items">
    <span>{{ item }}</span>
</li>

UI Bootstrap模式弹出窗口与AngularJS无法正常工作

1 个答案: