问题描述
在Angular4 中引入了jquery插件#jquery-seat-charts,测试jquery正常运行,当使用其插件动态产生html标签时,却发现标签中所有的class都无法正常显示,该class已经确认引入且不冲突。初步思考,是因为angular的加载机制与jquery插件的使用的不同,导致无法正常识别样式。现在依靠我目前的知识水平,还无法解决,恳请社区的朋友们能够指引我思路,万分感谢!
代码截图
引入:
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"./assets/js/jquery.seat-charts.js"
],
组件逻辑:
html代码:
<div class="wrapper">
<div class="container">
<div class="seatCharts-row"></div>
<div id="seat-map">
<div class="front-indicator">Front</div>
</div>
<div class="booking-details">
<h2>Booking Details</h2>
<h3> Selected Seats (<span id="counter">0</span>):</h3>
<ul id="selected-seats"></ul>
Total: <b>$<span id="total">0</span></b>
<button class="checkout-button">Checkout »</button>
<div id="legend"></div>
</div>
</div>
</div>
运行结果
实际运行结果:
期待运行结果:
相关分类