How to load MVC Partial View and keep Angular JS working

How should I load mvc partial views and keep Angular JS working. Angular JS is working fine after I render the layout, but if I load partial views in the layout, Angular JS is not working anymore in the partials. I guess that Angular engine is not compiling the ng- directives after I inject the HTML in the DOM.

Answers:

Answer

Instead of inject your HTML manually. Be it through angular.element.html or $().html. Try using one of the following, angular approved, options:

  • A routing engine like ngRoute or ui-router. The engine can include a template which is rendered by the backend.
  • The ngInclude directive. This way you can include HTML templates directly.
  • Write a custom directive which injects your HTML.

Because these are AngularJS friendly methods, Angular will actually parse the HTML and bind any values within the newly loaded HTML.

Answer

From an answer from here

I think you may need to compile HTML string or DOM into a template.

More information, please refer to:

$compile

https://docs.angularjs.org/api/ng/service/$compile

There are some threads that may help you:

AngularJS - Dynamically creating elements that specify directives

AngularJS - Dynamically creating elements that specify directives

Bind Angularjs to newly created html element dynamically

Bind Angularjs to newly created html element dynamically

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us Javascript

©2020 All rights reserved.