这有点奇怪。当我在线搜索此问题时,我看到许多页面的Google搜索结果和SO解决方案...但是似乎没有任何效果!
简而言之,我正在尝试实现AngularUI Bootstrap Modal。我不断收到以下错误:
这是我的HTML:
<nav class="navbar navbar-default">
<div class="container">
<span class="nav-col" ng-controller="navCtrl" style="text-align:right">
<a class="btn pill" ng-click="open()" aria-hidden="true">Add New</a>
</span>
</div>
</nav>
这是我的 Controller :
var app = angular.module('nav', ['ui.bootstrap']);
app.controller('navCtrl', ['$scope', '$uibModal', function($scope, $uibModal) {
$scope.open = function() {
var uibModalInstance = $uibModal.open({
animation: true,
templateUrl: 'addEntry/addEntry.html',
controller: 'addEntryCtrl',
});
};
}]);
最后,这是我的模态代码:
var app = angular.module('addEntry', ['firebase', 'ui.bootstrap']);
app.controller('addEntryCtrl', ['$scope', '$firebaseObject', '$state', '$uibModalInstance', function($scope, $firebaseObject, $state, $uibModalInstance) {
$scope.cancel = function() {
$uibModalInstance.dismiss('cancel');
};
$uibModalInstance.close();
}]);
我尝试过的解决方案:
有什么想法吗?现在已经将我推倒墙了将近2天。
*编辑*
我应该注意两件事:
1)当我从addEntry中删除$ uibModalInstance作为依赖项时,我的HTML表单提交按钮可以正常工作,并且表单看起来很完美。即使重定向正确发生(提交时)。问题仍然存在:模态仍停留在屏幕上,并引发错误,即$ uibModalInstance未定义。这是有道理的,因为我将其作为依赖项删除了,但是我显然仍然需要在提交时关闭该模式。
2)另外,我在应用程序的另一部分工作的代码几乎相同。唯一的区别是它通过工厂工作。否则,代码是相同的。因此,我确信我的依赖项全部存在并且版本正确。所以。抓狂奇怪。
谢谢!
最佳答案
找到答案!与我的 friend 偷走后,我们找到了答案。我想将其发布在这里,以防其他人阅读。
事实证明,在模态窗口中有一个ng-controller,它位于div标签中,该标签包装了模态中的整个html形式。以前,当我们的表单不在模式中时(它具有单独的URL),此方法可以很好地工作,但是由于某种原因,当它在模式中时,它会中断。 ng-controller正在引用addEntryCtrl
。删除后,该表格立即生效!