I am using Cordova 4.0.0 with AngularJS 1.2.26, Angular-Bootstrap 0.11.2
, and UI Router 0.2.11
to create apps for Android and Windows (8.0 and 8.1)
. I am having an issue only when running the application in Windows with ui-bootstrap
templates. The same error keeps popping up for standard templates for typeahead, datepicker, and the modal dialog, "Template for directive { whatever } must have exactly one root element."
Looking at the DOM inspector within Visual Studio, it seems that every node that has the ui-view directive is getting populated with its own set of head and body tags (which wraps around the template in question). I'm guessing that this is the issue, but am having trouble pinning down where these extra nodes are being inserted, and thus, having trouble proving out the theory.
The same code works as desired in the latest Chrome, FireFox, and IE desktop browsers, as well as within Android.
Does anyone have any insight on this behavior? It might also be worthwhile to note that ngCsp is being used to alleviate dyanmic content insertion restrictions on Metro applications.
Thanks in advance!