使用AngularJS和引导创建模式弹出窗口

嗨，我正在尝试创建一个简单的模式对话框，当用户点击按钮时弹出。我对Angular和Bootstrap是全新的，我很难弄明白。我在这里创建了一个plnkr

(function () {
'use strict';

angular
    .module('crm.ma', ['ui.bootstrap'])
    .controller('AdvancedSearchCtrl', function ($modal) {
        vm.openModal = function () {
            var modalInstance = $modal.open({
                templateUrl: 'topnav_advancedmodal.html',
                controller: 'searchCtrl as modal'
            });
        }
    })

});

---

上面的plnkr代码。请帮忙

您的代码有几个问题。以下是其中一些：

JavaScript

(function() {
  "use strict";

  angular.module('crm.ma', ['ui.bootstrap']). // You define new module with angular.module('...', []) syntax. If module is already initialised, use angular module('...') instead
    controller('searchCtrl', function() {}). // Make sure this controller exists and registered in angular
    controller('advancedSearchCtrl', ['$modal',function ($modal) { // Use ['x', function(x) {...}] syntax
        this.openModal = function () { // vm -> this
            var modalInstance = $modal.open({
                templateUrl: 'topnav_advancedmodal.html',
                controller: 'searchCtrl as modal' // <- make sure searchCtrl controller exists and is registered
            });
        };
    }]);

}());

（函数（）{
“严格使用”；
angular.module（'crm.ma'，['ui.bootstrap']）。//使用angular.module（'…'，[]）语法定义新模块。如果模块已初始化，请改用angular模块（'…'）
控制器（'searchCtrl'，function（）{}）。//确保此控制器存在并在中注册
控制器（'advancedSearchCtrl'，['$modal'，函数（$modal）{//使用['x'，函数（x）{…}语法
this.openModal=函数（）{//vm->this
var modalInstance=$modal.open({
templateUrl:'topnav_advancedmodal.html'，
控制器：“searchCtrl作为模态”//打开plunker并查看控制台errors@PetrAveryanov你的意思是看Chrome的控制台吗？我对plnkr不是很熟悉。这只是我第二次使用它。@PetrAveryanov我现在明白你的意思了。我纠正了控制器中的错误。现在当应用程序阳离子负载。1.我仍然看到旧的plunk 2。--在这里您可以找到示例并链接到工作plunk。3.始终在控制台中查找错误。4.$modal.open只创建几个div——如果您不使用modal，那么您可能忘了包含bootstrap.css