0

I am using jquery and angularJS(bad practice but i must).When navigating with jquery mobile,adding page in dom dosen't trigger angular because it is loaded only on first page.

1.html:

<html ng-app="aki" ng-controller="akicontrollers">
...
<section data-role="page">
   <ul id="gridaccom" data-role="listview" >

     <li  ng-repeat="object in barList"  id="lista" >
       {{object.Name}}
     </li>
   </ul>

<a href="2.html">LINK</a>
    </section>
    ...

2.html

<section data-role="page">
    <ul id="gridaccom1" data-role="listview" >

         <li  ng-repeat="object in barList"  id="lista" >
           {{object.Name}}
         </li>
       </ul>
</section>

Ng repeat works in 1.html but when inserted 2.html into dom i just get "{{object.Name}}" My question is :Is it possible to "relaunch" angular or let it rescan html document and compile page inserted in DOM?

Thanks in advance.

plunker: http://plnkr.co/edit/IjvHU3km42JvectwUoJn?p=info

marapet
  • 54,856
  • 12
  • 170
  • 184
Axon
  • 251
  • 1
  • 2
  • 9
  • 1
    This is basically the same as your other [question](http://stackoverflow.com/questions/23725376/angularjs-and-jquery-angular-dosent-bind-on-jquery-navigation). You need to provide a working demo of the problem in jsfiddle or plunker. Your anchor tag appears to be loading a completely separate page (2.html) that apparently doesn't have Angular set up correctly on it. – Jerrad May 19 '14 at 16:51
  • I can't.Jfiddle doesn't let multiple .html files and it is neccessary for this problem to have 2 or more .html files – Axon May 19 '14 at 16:58
  • It is not loading seperate page because i'm navigating with jquery.It is just adding section from 2.html in 1.html dom. – Axon May 19 '14 at 17:00
  • At least show your jquery that's doing the navigation. – Jerrad May 19 '14 at 17:07
  • 1
    Use [Plunker](http://plnkr.co/edit/?p=catalogue) instead of JS Fiddle. It allows you to use multiple HTML files. – Marc Kline May 19 '14 at 17:09
  • I suspect that you will need to use the $compile service, but without seeing more of your code, it's hard to be more specific. – Jerrad May 19 '14 at 17:18
  • 1
    I would strongly suggest using the angularjs friendly mobile frameworks such as these: http://ionicframework.com/ or http://mobileangularui.com/ ... they are easier to work with. – Pbrain19 May 19 '14 at 17:34
  • I'm afraid that isn't possible – Axon May 19 '14 at 17:36
  • @Jerrad added plunker – Axon May 19 '14 at 17:58
  • I'm not sure how you would go about intercepting JQuery Mobile fetching and injecting the html into the DOM. You may want to look at the [JQuery Mobile Angular Adapter](https://github.com/opitzconsulting/jquery-mobile-angular-adapter) project (although I imagine it would require you to make some big changes to your code). – Jerrad May 19 '14 at 18:29
  • i just need to reinit angular on page change or compile page again – Axon May 19 '14 at 18:35

0 Answers0