angularjs – Angular Bootstrap模态:未知的提供者:$modalInstanceProvider

前端之家收集整理的这篇文章主要介绍了angularjs – Angular Bootstrap模态:未知的提供者:$modalInstanceProvider前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图使用Angular Bootstrap Modal伪指令( http://angular-ui.github.io/bootstrap/)如下,在我的控制器中打开模态:
function customerSearch() {
    var modalInstance = $modal.open({
        templateUrl: 'app/customer/customers.modal.html',controller: 'customers.modal'
    });

    modalInstance.result.then(function(selectedCustomer) {
        console.log(selectedCustomer);
    });
}

在模态控制器中:

var controllerId = 'customers.modal';

angular.module('app').controller(controllerId,['$modalInstance',customersModal]);

function customersModal($modalInstance) {
    // Modal controller stuff
}

但是当我这样做,我得到以下错误

Unknown provider: $modalInstanceProvider <- $modalInstance

如果我拿出$ modalInstance,它的工作,但我显然没有参考模态在呼叫控制器。

编辑

我不知道是否值得注意,但我使用Controller作为语法:

<div class="container-fluid" data-ng-controller="customers.modal as vm">

应用程序依赖:

var app = angular.module('app',[
    // Angular modules 
    'ngAnimate',// animations
    'ngRoute',// routing
    'ngSanitize',// sanitizes html bindings (ex: sidebar.js)

    // Custom modules 
    'common',// common functions,logger,spinner
    'common.bootstrap',// bootstrap dialog wrapper functions

    // 3rd Party Modules
    'ui.bootstrap',// ui-bootstrap (ex: carousel,pagination,dialog)
    'breeze.directives',// breeze validation directive (zValidate)
]);

我创建了一个plunker,它在这里显示的问题:http://plnkr.co/edit/u8MSSegOnUQgsA36SMhg?p=preview

问题是,你在两个地方指定一个控制器 – 当打开一个模态和模板 – 这不是必需的。从模板中删除ng-controller,事情将按预期工作:
http://plnkr.co/edit/khySg1gJjqz1Qv4g4cS5?p=preview

猜你在找的Angularjs相关文章