Angular error: Template for directive must have exactly one root element

Published on 2024-05-25 by Raul

When using ui.bootstrap in an angular project, I find a lot of errors like this: 'Template for directive 'modalBackdrop' must have exactly one root element. template/modal/backdrop.html'

I searched the entire internet, don't know why more and more people don't have them.

The fix?

Search in the "ui-bootstrap-tpls-x.min.js" file for "/backdrop.html" (or whatever file is throwing the error). You will see that they end with a ' \n'. Remove that, and the error will be gone!

Keep in touch


Hey there, I'm Raul, owner of CreativeCLR, a small consulting company.

Feel free to drop me any question you might have on this post using the comment section or the contact page.