javascript - Angular UI 模式未显示
问题描述
我正在尝试添加一个模式,当用户单击这样创建的元素时会弹出:
<li ng-repeat="task in tasks | filter:{Status: 0}" class="list-group-item list-group-item-danger" ng-click="getTask(task)">
这是 getTask 函数:
$scope.getTask = function (task) {
taskService.getTask(task.Id)
.then(task => {
var modalInstance = $uibModal.open({
animation: true,
templateUrl: "Content/partials/TaskModal.html",
controller: "taskModalController",
resolve: {
task: function () {
return task
}
}
});
modalInstance.result.then(task => {
if (task)
updateTask(task);
});
})
};
模板只是一个带有表单的 div。
<div class="panel panel-primary">
<div class="panel-heading">Edit Task</div>
<div class="panel-body">
<form name="EditTask" ng-submit="saveTask()" class="form-inline mb-5">
<div class="form-group col-lg-4">
<label for="Assignee">Assignee</label>
<input type="text" name="Assignee" class="form-control" required ng-model="EditTask.Assignee" ng-minlength="5" />
</div>
<div class="form-group col-lg-4">
<label for="Assignment">Assignment</label>
<input type="text" name="Assignment" class="form-control" ng-model="EditTask.Assignment" required ng-minlength="5" />
</div>
<div class="form-group col-lg-4">
<input type="submit" name="Save" value="Save" class="btn btn-success btn-lg"
ng-disabled="EditTask.$invalid" />
</div>
</form>
</div>
</div>
单击元素时,实际上会创建模态,但是它是完全不可见的。可以单击按钮,将鼠标悬停在按钮上时指针会发生变化,检查文件表明信息已正确传递。
我在这里错过了什么阻止我展示这个模式?
编辑:
在head
我有 CSS 链接:
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" crossorigin="anonymous">
在正文的底部,脚本:
<script src="/bower_components/angular/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular-sanitize.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
<script src="~/Content/js/app.js"></script>
<script src="~/Content/js/directives.js"></script>
解决方案
推荐阅读
- python-3.x - xls文件中数字的科学记数法-python
- android - 我如何在 GeckoView 上使用 canGoBack()
- python - MySQL 用空字符串替换 Null
- java - Firestore 查询在 Geoquery 中工作两次
- django - Heroku中的Django翻译管理器路径问题
- angular - this.usuarioSubject = 新的 BehaviorSubject
(JSON.parse(localStorage.getItem('user'))); 有人知道为什么这是错误的' - android - Firebase 查询无法正常工作,未显示所需结果
- github - 如何为 github 配置文件设置默认自定义域
- php - 数据未保存到数据库
- c# - 抛出异常:System.Data.SqlClient.dll 中的“System.Data.SqlClient.SqlException”