Hacker News new | ask | show | jobs
by Nitramp 4695 days ago
You can see the important difference between Amber and AngularJS in the 'computed properties' snippet of Amber:

    App = Ember.Application.create();

    App.ApplicationController = Ember.Controller.extend({
        name: '',
        greeting: function() {
            if (this.name.length < 1) return '';
            return 'Hello, ' + this.name;
        }.property('name')
    });
You write this to use a property 'greeting' in a view that's calculated from a different property 'name'. This works for one model, but imagine you have dependencies across different model objects, nested properties, and so forth. Seems like it'll get complicated pretty quickly.

In AngularJS, that's just (in the template, or a controller function, or where ever):

    {{name + greeting}}
AngularJS uses dirty checking, which makes it trivial to implement complicated interdependencies between various fields. Any plain JavaScript code will work, including model objects that were not written as Ember code.

This comes at the cost of the dirty-checking loop (checking each expression in a tight loop on every user 'event'), but in my experience that's at least not a problem for normal desktop web applications.

2 comments

I'm not sure I really catch your drift, but:

Using

  {{name}} {{greeting}}
in Ember should have the same effect as

  {{name + greeting}}
in your example, right?

You need not use computed properties in Ember, because updates on ordinary model fields are also updated in templates in real-time (AFAIK works very similar to KVO in Objective-C). Computed properties are just a ridiculously useful concept which allows you to modify/transform stuff before you show it to the user, similar to the view-model in MVVM. How would you show an empty string in Angular with "{{name + greeting}}" if name is empty?

I wrote that contrived example to show off computed properties. In idiomatic Ember.js, I would have written the template as follows, with no Computed Property (indeed, no explicit Controller) needed:

    {{#if name}}Hello, {{name}}{{/if}}