Я работаю с Angular 9 Установлено bootstrap и jquery Следующие записи в моем пакете. json
"bootstrap": "^4.4.1",
"jquery": "^3.5.0",
импортированные css и js файлы в angular. json как ниже
"styles": [
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.css"
],
"scripts": [
"./node_modules/jquery/dist/jquery.js",
"./node_modules/bootstrap/dist/js/bootstrap.js"
]
и добавил следующий код в мое html тело
<body>
<div class="accordion" id="accordionExample">
<div class="card">
<div class="card-header" id="headingOne">
<h2 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne"
aria-expanded="false" aria-controls="collapseOne">
Collapsible Group Item #1
</button>
</h2>
</div>
<div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
Body1
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h2 class="mb-0">
<button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo">
Collapsible Group Item #2
</button>
</h2>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
<div class="card-body">
Body2
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h2 class="mb-0">
<button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseThree"
aria-expanded="false" aria-controls="collapseThree">
Collapsible Group Item #3
</button>
</h2>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
<div class="card-body">
Body 3
</div>
</div>
</div>
</div>
</body>
Но когда я нажимаю Аккордеон, я получаю следующую ошибку в консоли
Uncaught TypeError: Cannot convert object to primitive value
at RegExp.test (<anonymous>)
at HTMLDivElement.<anonymous> (bootstrap.js:1509)
at Function.each (jquery.js:381)
at jQuery.fn.init.each (jquery.js:203)
at jQuery.fn.init._jQueryInterface [as collapse] (bootstrap.js:1503)
at HTMLDivElement.<anonymous> (bootstrap.js:1563)
at Function.each (jquery.js:381)
at jQuery.fn.init.each (jquery.js:203)
at HTMLButtonElement.<anonymous> (bootstrap.js:1558)
at HTMLDocument.dispatch (jquery.js:5429)
Я не могу понять, в чем проблема, пожалуйста, помогите.
Снимок экрана с ошибкой