Have you ever worked on a website that displayed data dynamically? Are you tired of putting HTML markup inside Javascript?
Chances are you’ve looked into using what’s known as an MV* framework. These kind of frameworks aim to help reduce the effort in binding Javascript and JSON data to the user’s screen.
Learn more about 3 of the most popular frameworks being talked about in the developer community: Knockout (by a Microsoft employee), Angular (by Google), and Ember (by a Rails and jQuery contributor).
We’ll compare and contrast these frameworks and how they ranked against our criteria in building a client-side heavy application that updates its data in real time.
2. Users expect more
Interfaces can be complex and dynamic
Postbacks don’t cut it anymore
People are impatient, don’t want to wait
A good user experience is now the norm
10. Documentation and Support
• Step-by-step tutorials with code editor
• Interactive examples and code blocks
• 1,120 hits on StackOverflow
11. Documentation and Support
• No tutorials for beginners
• Several examples with code blocks but
some errata
• API documentation has gaps
• 784 hits on StackOverflow
16. JavaScript Conventions/Making
Changes
function makeChanges() {
App.myMainObject.myName("New Name");
App.myMainObject.myCars.push({ name: "Honda Pilot" });
}
Properties are converted to methods, that's how it can trigger
changes on the screen.
The standard Js array methods all work: push, pop, unshift,
shift, reverse, sort, and splice.
17. JavaScript Conventions/Making
Changes
function makeChanges() {
App.myMainObject.set("myName", "New Name");
App.myMainObject.pushObject({ name: "Honda Pilot" });
}
Properties must be modified with the 'set' method to
trigger changes on the screen.
The standard Js array methods won't work, but they've
added a bunch of handier methods instead.
18. JavaScript Conventions/Making
Changes
function makeChanges() {
App.controllerScope.$apply({
App.myMainObject.myName = "New Name";
App.myMainObject.pushObject({ name: "Honda Pilot" });
});
}
Regular Js can be used to manipulate objects
but if they're happening outside of Angular's
world you must wrap it with a call to $scope.$apply().