Angular incompatibility with html attributes


Angular incompatibility with html attributes



I have an imported css template written on bootstrap, and want to use it inside Angular app. CSS are imported from index.html



Application characteristics.
This is a SPA, and all of pages are loaded inside Navbar Component, with corresponding router-outlet wrapping.



Problem.
Any plugin will render included data only after "mechanical" refreshing page with browser "Reload this page" button. But if I change a src for image, from plugin custom attribute, for example


data-background="assets/images/slider_1.jpg"



to


img src="assets/images/slider_1.jpg"



, it will be loaded and shown from the first time.



Example of map plugin. Doesnt show nothing.





</div>



Example of slider plugin. No background image.


<section class="module-cover parallax text-center"
data-background="assets/images/slider_1.jpg"
data-overlay="0.5">




This is title



</div>
</section>



Example of grid item for blog. Here, it should follow masonry style, but renders like strict grid.


<section class="module-cover parallax text-center"
data-background="assets/images/slider_1.jpg"
data-overlay="0.5">



Seems like exactly these custom attributes don't react from a first loading.









By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

PHP contact form sending but not receiving emails

Do graphics cards have individual ID by which single devices can be distinguished?

iOS Top Alignment constraint based on screen (superview) height