Skip to main content
I mentioned "directives", which are an angular1 thing; updated to angular2 concepts
Source Link
Daniel Beck
  • 21.7k
  • 5
  • 43
  • 61

Angular expects to be in control of the DOM, and its philosophy of how the page and the data interact mixes poorly with jQuery (in jQuery you tend to make a lot of direct DOM modifications, while in Angular the DOM is almost a side-effect representation of the scope data; modifications to the DOM made outside Angular's expected path can get blown away on the next digest, or can overwrite or destroy bindings that Angular depends on.)

Manipulating the DOM separately through jQuery is possible, so long as you use great care not to interfere with the Angular lifecycle -- but it's highly error prone unless you have a very strong understanding of Angular's DOM lifecycle and of what is and isn't safe to change. It's rarely necessary; it's almost always better to use Angular's own tools.

(Also note that Angular includes jqLite; much of the time the jQuery function you're looking for is already available without needing to install the full library.)

(If you must use jQuery, keep it within specific directives'Components' linkafterViewInit function and never try to e.g. modify the results of one directivecomponent from within another.)

Angular expects to be in control of the DOM, and its philosophy of how the page and the data interact mixes poorly with jQuery (in jQuery you tend to make a lot of direct DOM modifications, while in Angular the DOM is almost a side-effect representation of the scope data; modifications to the DOM made outside Angular's expected path can get blown away on the next digest, or can overwrite or destroy bindings that Angular depends on.)

Manipulating the DOM separately through jQuery is possible, so long as you use great care not to interfere with the Angular lifecycle -- but it's highly error prone unless you have a very strong understanding of Angular's DOM lifecycle and of what is and isn't safe to change. It's rarely necessary; it's almost always better to use Angular's own tools.

(Also note that Angular includes jqLite; much of the time the jQuery function you're looking for is already available without needing to install the full library.)

(If you must use jQuery, keep it within specific directives' link function and never try to e.g. modify the results of one directive from within another.)

Angular expects to be in control of the DOM, and its philosophy of how the page and the data interact mixes poorly with jQuery (in jQuery you tend to make a lot of direct DOM modifications, while in Angular the DOM is almost a side-effect representation of the scope data; modifications to the DOM made outside Angular's expected path can get blown away on the next digest, or can overwrite or destroy bindings that Angular depends on.)

Manipulating the DOM separately through jQuery is possible, so long as you use great care not to interfere with the Angular lifecycle -- but it's highly error prone unless you have a very strong understanding of Angular's DOM lifecycle and of what is and isn't safe to change. It's rarely necessary; it's almost always better to use Angular's own tools.

(Also note that Angular includes jqLite; much of the time the jQuery function you're looking for is already available without needing to install the full library.)

(If you must use jQuery, keep it within specific Components' afterViewInit function and never try to e.g. modify the results of one component from within another.)

Source Link
Daniel Beck
  • 21.7k
  • 5
  • 43
  • 61

Angular expects to be in control of the DOM, and its philosophy of how the page and the data interact mixes poorly with jQuery (in jQuery you tend to make a lot of direct DOM modifications, while in Angular the DOM is almost a side-effect representation of the scope data; modifications to the DOM made outside Angular's expected path can get blown away on the next digest, or can overwrite or destroy bindings that Angular depends on.)

Manipulating the DOM separately through jQuery is possible, so long as you use great care not to interfere with the Angular lifecycle -- but it's highly error prone unless you have a very strong understanding of Angular's DOM lifecycle and of what is and isn't safe to change. It's rarely necessary; it's almost always better to use Angular's own tools.

(Also note that Angular includes jqLite; much of the time the jQuery function you're looking for is already available without needing to install the full library.)

(If you must use jQuery, keep it within specific directives' link function and never try to e.g. modify the results of one directive from within another.)