Question

将我的应用程序中的bootstrap从3.3.6升级到4后，我开始收到错误错误$（...）。modal不是一个函数，其中（modal）以前工作正常。错误

angular.js:14700 TypeError: $(...).modal is not a function
at ReviewQueueController.js?V=1.2:122
at angular.js:20440
at completeOutstandingRequest (angular.js:6362)
at angular.js:6642

我正在使用角度js。当成功，错误或任何信息我使用模态。我试图用小提琴复制这个问题。

我刚刚开始研究角度，所以我不确定如何修复。

Fiddle Link

在我研究的很多帖子中，建议对css进行更改

.fade.in {
  opacity: 1;
}

.modal.in .modal-dialog {
   -webkit-transform: translate(0, 0);
   -o-transform: translate(0, 0);
    transform: translate(0, 0);
 }

.modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: .5;
 }

许多链接建议使用像here这样的noconflict。我不确定如何与angularjs无法发生冲突

请建议我可以采取哪些措施来解决问题

Answer 1

他们GitHub repo我们提到的一个解决方案是将它放在你的html中：

<!-- Enable bootstrap 4 theme -->
<script>window.__theme = 'bs4';</script>

此外，您可能需要在ViewEncapsulation中停用app.component.ts。

请参阅“禁用CSS封装”here了解如何操作。

<强>更新：

似乎你的小提琴中缺少jQuery脚本文件。我补充说，在你的，现在它的工作原理：

here

获得错误$（...）。modal在升级后的bootstrap 3.3.6到4.0.0之后不是angularjs中的函数

1 个答案: