首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >尝试使用$modal时出现错误:[$injector:modulerr]

尝试使用$modal时出现错误:[$injector:modulerr]
EN

Stack Overflow用户
提问于 2015-10-26 17:53:47
回答 1查看 268关注 0票数 0

我是angular的新手,正在尝试获得一个模式窗口并遵循http://www.bennadel.com/blog/2806-creating-a-simple-modal-system-in-angularjs.htm

但是当我加载页面时,我得到了以下错误-

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Error: [$injector:modulerr] http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=drag-and-drop&p1=%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.15%2F%24injector%2Fnomod%3Fp0%3Ddrag-and-drop%0AR%2F%3C%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A6%3A417%0AOd%2F%3C%2F%3C%2F%3C%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A21%3A412%0Aa%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A21%3A53%0AOd%2F%3C%2F%3C%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A21%3A1%0Ag%2F%3C%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A35%3A46%0Ar%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A7%3A300%0Ag%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A34%3A399%0Aab%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A38%3A135%0Auc%2Fd%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A17%3A381%0Auc%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A18%3A179%0AJd%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A17%3A1%0A%40https%3A%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.15%2Fangular.min.js%3A250%3A429%0Am.Callbacks%2Fj%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1%2Fjquery.min.js%3A2%3A27239%0Am.Callbacks%2Fk.fireWith%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1%2Fjquery.min.js%3A2%3A28057%0A.ready%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1%2Fjquery.min.js%3A2%3A29889%0AJ%40https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1%2Fjquery.min.js%3A2%3A30255%0A

现在我做了一些研究,发现可能是由于无法找到合适的模块而导致的注入

这是我的控制器初始化-

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var App = angular.module('drag-and-drop', ['ngDragDrop']);

App.controller('oneCtrl', function($scope, $modal) {...});

现在我尝试了所有这些选项,但它们总是给出不同的错误

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var App = angular.module('drag-and-drop', ['ngAnimate']);

App.controller('oneCtrl', function($scope, $modal) {...});

然后像这样定义-

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
App.controller('oneCtrl', ['$scope', '$modal', function($scope, $modal) {

我所包含的脚本是-

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular-animate.min.js"></script>
    <link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
    <link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap.min.css" rel="stylesheet" />
    <script src="{!$Resource.AngularDragDrop}" ></script>

任何帮助都会让我很高兴

THanks,雷

EN

回答 1

Stack Overflow用户

发布于 2015-10-26 17:59:37

你正在尝试使用属于库的$modal对象,如果你真的想使用模式弹出窗口,我建议你在你的项目中添加angular-ui-bootstrap库。

添加库引用后,您需要在应用程序依赖项中添加ui.bootstrap模块引用。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var App = angular.module('drag-and-drop', ['ngDragDrop', 'ui.bootstrap']);

或者,如果你不需要那里的模式,你可以从控制器依赖中删除$modal

因为您的给定链接有一个注入modals依赖的代码,并且在该代码中定义了modals自定义服务。您需要在您的应用程序中添加该服务。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/33352410

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文