This article mainly introduced the jquery Operation Angularjs object's related data, needs the friend to be possible to refer to under
jquery is a very powerful JS framework, Angularjs is a very bull's front-end MVC framework. Although using any of these frameworks is sufficient in the project, sometimes the two frameworks need to be mixed, although not recommended. But sometimes when mixing, but very convenient, do not consider so much, as long as can achieve function, why not?
Recently made a product, the front end with ANGULARJS, but the table framework with the jquery.datatables.js, of course, there is no need to encounter jquery and angularjs interaction problems. Because of the confidentiality of the company, I do not need to demonstrate the real project, write a small demo bar, of course, the real project is much more complicated.
Code
Effect
Point two times, these three values are added to 2, seemingly no problem.
Are you sure?
What if the view is 2,model or 0, and no synchronization is implemented?
So what's the problem with jquery and Angularjs?
Change the Code
|
$ (' #btn '). On (' click ', Function (e) {var scope=angular.element (' #dv2 '). scope ();//jquery+angular implementation scope.test2= scope.test2+1;//directly modifies the value of Test2 console.log (SCOPE.TEST2); $ (' #dv3 '). Text (Number ($ (' #dv3 '). Text ()) +1;//Pure jquery implementation}); |
Look again.
Two times, the middle one becomes 1, the other two is 2.
3 times, the middle one becomes 2, but what is the value of scope.test2, and how does it always show a slow beat?
and change it.
|
$ (' #btn '). On (' click ', Function (e) {var scope=angular.element (' #dv2 '). scope ();//jquery+angular implementation scope.test2= scope.test2+1;//directly modifies Test2 's value scope. $apply ();//bind to view Console.log (SCOPE.TEST2); $ (' #dv3 '). Text (Number ($ (' #dv3 '). Text ()) +1;//Pure jquery implementation}); |
Look again.
These three are synchronized. Chinese medicine is good, Western medicine is fast, the combination of!jquery simple, angularjs convenient, both ... Done.
Note: The scope object must invoke $apply (), otherwise the view and model will appear differently.
The above mentioned is the entire content of this article, I hope you can enjoy.