-1

Jquery is ignoring all Angular ng binds(ng-app,ng-controller,ng-bind..) on page change.They are working in index but when I navigate to other pages ng-s just aren't working.Is there a way to "rebind" angular when page dynamically changes?

in first html:

<section data-role="page" ng-app="aki" ng-controller="akicontroller">

<a href="sec.html"></a>

</section>

in second html ng-app and ng-controller are ignored:

<section data-role="page" ng-app="aki" ng-controller="akicontroller">

</section>

Pages are loaded via jquery in dom.

Thank you in advance.

Axon
  • 251
  • 1
  • 2
  • 9

2 Answers2

0

ng-app is used for designating the root of the app and should be placed in root elements of the page (html/body). If you do actually need >2 apps running in one html document then you must bootstrap them. Refer to the Angular documentation for ng-app: https://docs.angularjs.org/api/ng/directive/ngApp

leaksterrr
  • 3,800
  • 7
  • 34
  • 65
  • even if ng-app is in html tag in index,on page change that bind isnt't working – Axon May 18 '14 at 18:39
  • Are you including all the necessary .js files in your sec.html page? It's a whole new page, so you'll need to load up angular.js again. – Jerrad May 18 '14 at 19:42
  • Yes,i am including them.It isn't whole new page it is just section loaded from another html and inserted in dom.Angular just dosent't proccess it. – Axon May 18 '14 at 22:23
  • I just need to refire angular to "see" ng in dynamically loaded html. – Axon May 18 '14 at 22:24
0

If you are going to use jquery with angular, you should convert any plugin into a directive. The video below explains alot on how it is done.

https://www.youtube.com/watch?v=9Bu73oQQSio

This will ensure that your bindings update.

Pbrain19
  • 1,975
  • 2
  • 14
  • 11