TypeError:providedScope.$ new不是函数 - angular bootstrap模态

Question

我一直关注这里的官方指南,但仍然得到错误.GitHub上的用户经历了同样的问题,但没有提到它是如何解决的,只是他的代码中有一个错误调用他的工厂,我无法从他的plnkr中找出任何东西.

控制器:

function ActivitiesController($scope, $state, $window, Authentication, activity, $uibModal, $uibModalInstance) {
    var vm = this;

    vm.authentication = Authentication;
    vm.activity = activity;
    vm.openModal = openModal;
    vm.okOnModal = okOnModal;
    vm.cancelOnModal = cancelOnModal;

    function openModal() {
        $uibModal.open({
            template: "<div class='modal-header'>"
                        + "<h3 class='modal-title' id='modal-title'>Friends</h3>"
                    + "</div>"
                    + "<div class='modal-body list-group' id='modal-body'>"
                        + "<a ng-repeat='friend in vm.friends' class='list-group-item'>"
                            + "<img class='friend-user-profile-picture' ng-src='{{ friend.friend.profileImageURL }}' alt='{{ friend.friend.displayName }}'>"
                            + "<h4 class='list-group-item-heading' ng-bind='friend.friend.displayName'></h4>"
                            + "<small class='list-group-item-text' ng-bind='friend.friend.username'></small>"
                            + "<p class='list-group-item-text' ng-bind='friend.friend.email'></p>"
                            + "<input type='checkbox'>"
                        + "</a>"
                    + "</div>"
                    + "<div class='modal-footer'>"
                        + "<button class='btn btn-primary' type='button' ng-click='vm.okOnModal()'>OK</button>"
                        + "<button class='btn btn-warning' type='button' ng-click='vm.cancelOnModal()'>Cancel</button>"
                    + "</div>",
            size: 'lg',
            scope: vm
        });
    }

    function okOnModal() {
        $uibModalInstance.close();
    }

    function cancelOnModal() {
        $uibModalInstance.dismiss('cancel');
    }
}

视图:

<button class="btn btn-primary btn-lg" ng-click="vm.openModal()">Share with...</button>

错误在ui.bootstrap-tpls这里:

var modalScope = providedScope.$new();

依赖关系:

• Angular :( 1.4.8 升级自0.3)
• Angular-bootstrap :( 2.4.0 升级自0.13.4)
• 引导: 3.3.7
• MEAN.JS: 0.4.2

阅读MEAN.JS文档,0.4.2使用0.13.4不支持的angular-ui $uibModal.由于不支持它,这就是我升级到的原因2.4.0.没有提到MEAN.JS 0.4.2不支持angular-ui,2.4.0但这可能是潜在的原因吗？


编辑:

我已经排除了它依赖于依赖版本,因为我已经更改回MEAN.JS堆栈中带有'0.4.2'的默认版本(因此使用$modal而不是$uibModal),我得到了类似的错误:

TypeError :( modalOptions.scope || $ rootScope).$ new不是函数

Answer 1

vm作为模态的父范围提供.这是问题,因为vm不是范围.它是控制器实例和当前范围上的对象(如果使用controllerAs语法).

vm不应该是可以互换的$scope.它应该是:

scope: $scope