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 是一个JavaScript 框架。它可通过 注:建议把脚本放在 元素的底部。这会提高网页加载速度,因...
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题,也即是页面闪烁问题。出现这个的原因是:由于...
AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有...
AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内:{{ expres...
ng-repeat 指令可以完美的显示表格。在表格中显示数据 {{ x.Name }} {{ x.Country }} 使用 CSS 样式为了...
$http是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。读取 JSON 文件下是存储在web服务器上...