javascript - Angular ui-router and Google autocomplete issue -

i have created ui-router based tabs. 1 of them has google autocomplete input.

.state('manage', {   templateurl: "/templates/pages/issues/manage.html",   controller: 'issuemanagecontroller' }) .state('manage.tab', {   url: "/manage/:tab",   templateurl: function ($stateparams){     return '/templates/pages/forms/' + $stateparams.tab + '.html';   }, }); 

tabs panel generator

<ul class="form--tabs">   <li ng-repeat="tab in tabs" ui-sref="manage.tab({tab: tab.template})" ui-sref-active="selected" ng-class="{'selected': isselected($index)}"><span>{{tab.title}}</span></li> </ul> 

the template autocomplete code

<input type="text" id="googleplace" ng-model="form.object.fulladdress"> ... ... <script>   var input = document.getelementbyid('googleplace');   var autocomplete = new google.maps.places.autocomplete(input); </script> 

after filling out input tabs' templates becomes blank without errors. it's same templates. problem not reproducing in firefox there problem in safari , chrome.

added....

the problem in nested routes. when changed routes direct states .state('profile'), .state('location') ... , added wrapper code manage.html each of templates problem not reproduced.

but it's not solution think. lot of code repeated.