Top 10 JavaScript MVC Frameworks

[Johan Steenkamp]

I came across this post and pointed out that the author had missed Angular.js - after taking a look he rated it second after ember.js

[ThomasBurleson]

Ember.js does seem to have some nice elements:

1) Computed properties with databinding support.
2) Support for templating logic {{#IF}}, {{ELSE}}, AND {{#UNLESS}} to
conditionally skip/include template sections
3) Composed child view templates

Can the AngularJS dev team provide insight/thoughts regarding
AngularJS support for the above?
(ie. how do we achieve these in AngularJS apps ? )

- ThomasB

[Dan Doyon]

Haven't looked at EmberJs yet (will definitely do so) but I'll take a stab. See my ##comments##, i'm sure you'll get more from the team. 

##dan##

On Jan 15, 2012, at 1:42 PM, ThomasBurleson wrote:

Ember.js does seem to have some nice elements:

1) Computed properties with databinding support.

##1## you can do computed properties using functions and of course you can do expressions in the templates (i.e. {{a * b}})

see http://docs.angularjs.org/#!/cookbook/mvc?board=%2C%2C%3B%2C%2C%3B%2C%2C/X

grade: function(){

      var b = this.board;

      this.winner =

        row(0) || row(1) || row(2) ||

        col(0) || col(1) || col(2) ||

        diagonal(-1) || diagonal(1);

      function row(row) { return same(b[row][0], b[row][1], b[row][2]);}

      function col(col) { return same(b[0][col], b[1][col], b[2][col]);}

      function diagonal(i) { return same(b[0][1-i], b[1][1], b[2][1+i]);}

      function same(a, b, c) { return (a==b && b==c) ? a : '';};

    },

2) Support for templating logic  {{#IF}}, {{ELSE}}, AND {{#UNLESS}} to
conditionally skip/include template sections

##2## Having if/else/unless in code just seems wrong to me (IMHO). Angular's $route mechanism keeps this sorta thing out of the template. 

http://docs.angularjs.org/#!/cookbook/deeplinking

3) Composed child view templates

##3## Not sure what this is. Sounds like more conditional templating. I think Angular's widgets/directives could satisfy what this is suggesting. Would need to see an example to really make an informed comment. 

Can the AngularJS dev team provide insight/thoughts regarding
AngularJS support for the above?
(ie.  how do we achieve these in AngularJS apps ? )

- ThomasB


On Jan 15, 1:55 pm, Johan Steenkamp <johan.steenk...@gmail.com> wrote:

I came across this post and pointed out that the author had missed

Angular.js - after taking a look he rated it second after ember.js

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.

[Dan Doyon]

Ahhh, Ember was sproutcore, rebranding. 

[Dan Doyon]

Not sure if there is a simpler way but here is how I think you could do computed properties.

http://jsfiddle.net/dandoyon/VdUQa/

[ThomasBurleson]

very interesting solution. Does .$watch()

1) accept an array of property names to watch?
2) provide a change event to the callback function that identifies the
property changed?

E.g. scope.$watch ( ['firstName', 'lastName'], function ( event)
{ ...} )

On Jan 15, 10:28 pm, Dan Doyon <dando...@yahoo.com> wrote:
> Not sure if there is a simpler way but here is how I think you could do computed properties.
>
> http://jsfiddle.net/dandoyon/VdUQa/
>
> On Jan 15, 2012, at 8:02 PM, Dan Doyon wrote:
>
>
>
>
>
>
>
> > Ahhh, Ember was sproutcore, rebranding.
>
> > On Jan 15, 2012, at 5:17 PM, Dan Doyon wrote:
>
> >> Haven't looked at EmberJs yet (will definitely do so) but I'll take a stab. See my ##comments##, i'm sure you'll get more from the team.
>
> >> ##dan##
>
> >> On Jan 15, 2012, at 1:42 PM, ThomasBurleson wrote:
>
> >>> Ember.js does seem to have some nice elements:
>
> >>> 1) Computed properties with databinding support.
>
> >> ##1## you can do computed properties using functions and of course you can do expressions in the templates (i.e. {{a * b}})
>

> >> seehttp://docs.angularjs.org/#!/cookbook/mvc?board=%2C%2C%3B%2C%2C%3B%2C...

> >>> For more options, visit this group athttp://groups.google.com/group/angular?hl=en.

>
> >> --
> >> You received this message because you are subscribed to the Google Groups "AngularJS" group.
> >> To post to this group, send email to ang...@googlegroups.com.
> >> To unsubscribe from this group, send email to angular+u...@googlegroups.com.

> >> For more options, visit this group athttp://groups.google.com/group/angular?hl=en.

[ThomasBurleson]

$route is great for partials...
but does it handle partials that reference child partials/
controllers ?

On Jan 15, 7:17 pm, Dan Doyon <dando...@yahoo.com> wrote:
> Haven't looked at EmberJs yet (will definitely do so) but I'll take a stab. See my ##comments##, i'm sure you'll get more from the team.
>
> ##dan##
>
> On Jan 15, 2012, at 1:42 PM, ThomasBurleson wrote:
>
> > Ember.js does seem to have some nice elements:
>
> > 1) Computed properties with databinding support.
>
> ##1## you can do computed properties using functions and of course you can do expressions in the templates (i.e. {{a * b}})
>

> seehttp://docs.angularjs.org/#!/cookbook/mvc?board=%2C%2C%3B%2C%2C%3B%2C...

[ThomasBurleson]

note that Ember supports notation like

fullName = function() {
return firstName + ' ' + lastName;
}.property('firstName', 'lastName');

to define a computed property and its dependencies.

[Dan Doyon]

I've updated fiddle

http://jsfiddle.net/dandoyon/VdUQa/

Currently, you get (scope, newVal, oldVal)

i believe this may change to have scope at the end of the signature list

--dan

[Dan Doyon]

have not tried this

[Dan Doyon]

with scope.$watch you watch an expression, so you can do something like you suggest

scope.$watch ( ['firstName', 'lastName'],

but as a literal string, you can't give it an actual array.

scope.$watch( '[firstName,lastName]',

in the end you are doing same thing with less quoting, see below update to prior example

http://jsfiddle.net/dandoyon/FnnDG/4/

--dan

[_pants]

FWIW, I was using Ember.js before I discovered Angular and find Angular far nicer. I find the way you spell things in Angular to be more concise and more elegant, and hit far fewer stumbling blocks trying to integrate with other things (e.g. pushing updates from server via juggernaut (and subsequently cometd)).

I'm still a n00b to both of them though so take this with a grain of salt.

[_pants]

Oh, and most important, the quality of Angular's documentation blows Ember's out of the water. (At least as of a couple weeks ago. Doesn't look like emberjs.com has a lot more there now.)

P.S. Didn't see a link to the actual post you're talking about, so I assume it's this one: http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/

P.S. If as I suspect Angular really does deserve to be #1 on this list, I'd love to see it get commensurate attention and recognition. Will sing its praises/upvote wherever possible, any help appreciated. Go go gadget marketing.

[john tigernassau]

Fwiw angular site plays better with my tablet site - ember is an overlapping float  mess - both could use a dash of skeleton

On Jan 17, 2012 2:18 AM, "_pants" <_pa...@anotherwebsite.org> wrote:

FWIW, I was using Ember.js before I discovered Angular and find Angular far nicer. I find the way you spell things in Angular to be more concise and more elegant, and hit far fewer stumbling blocks trying to integrate with other things (e.g. pushing updates from server via juggernaut (and subsequently cometd)).

I'm still a n00b to both of them though so take this with a grain of salt.

--

You received this message because you are subscribed to the Google Groups "AngularJS" group.

To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/4mfxdXCfDBkJ.

[Vojta Jina]

Hey guys, at first, thank you so much guys for getting Angular into the list.

I'm actually not that familiar with Ember.js, so I'm gonna look into it now...

ad 1/ I'm not sure, what you mean with computed properties ?

You can bind to any html attribute, using ng:bind-attr directive: http://docs-next.angularjs.org/api/angular.directive.ng:bind-attr

ad 2/ We don't want logic in template, because of testing.

Do you know ng:show, ng:switch, etc... ? That should do what you are asking about...

ad 3/ at this point, you can use ng:include/ng:view, or share html templates by creating a widget.

But we know, this is not enough, new compiler will allow templates - so that you can define a template and use it multiple times on your page. The template can be loaded async as well.

=============

Bedtime Story :-D

I'm not expert in other frameworks, I only know backbone, which is very nice (very lightweight though - angular provides far more stuff), did a lot of ExtJS (3.0) in the past, touched all mentioned frameworks (except Ember.js and Batman.js).

For me, the biggest advantage of Angular is the testability story. The whole design strongly supports testability. (I'm not talking about writing less code - that's what all other frameworks do as well).

Most of the people agree, that testing is good, but they still don't do it, because they don't know how. It's difficult. It took me couple of months to build useful testing environment with ExtJS and I always felt sort of fighting with the framework to get the code under test. (nothing against ExtJS, it's awesome and they made big improvements towards testability in 4.0).

With Angular, I believe it's much easier to test and testing is still the most effective way of development I know. Last time I saw the power of testing was when upgrading DFA (probably biggest project on Angular) to 0.10.*, which was huge change and I can't imagine doing this without having tests. It would have been disaster.

V.

[Vojta Jina]

Ok, I've just gone quickly through ember.js docs. They do binding in similar way as Backbone.js - through events.

So now I understand, what you meant with "computed properties". The answer is, angular can bind to anything, so you don't need this. With angular you don't have to specify dependencies for properties...

// this works with angular

function Person(first, last) {

  this.first = first;

  this.last = last;

}

Person.prototype.fullName = function() {

  return this.first + ' ' + this.last;

};

// and you can bind in tpl

<span> Person: {{personInstance.fullName()}}</span>

Much simplier,

V.

[Dan Doyon]

Nice! I figured someone would come up with a simpler solution than mine. 

I guess with my solution you can see what the old values are first but at the expense of having the overhead of watchers and more code.

--dan

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.

To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/8QWApKKothAJ.

[_pants]

On Tuesday, January 17, 2012 1:14:17 AM UTC-5, Vojta Jina wrote:

ad 3/ at this point, you can use ng:include/ng:view, or share html templates by creating a widget.

But we know, this is not enough, new compiler will allow templates - so that you can define a template and use it multiple times on your page. The template can be loaded async as well.

When this is released, I'd like the author of that blog post to be among the first to know. Still can't get over picking Ember over Angular.

[Johan Steenkamp]

Vojta, Dan, Thomas - thanks for your inputs. 

I should have mentioned the helpful angular community (with direct input from the core developers) when I pointed out he had missed angular in his initial review. 

Hopefully he picks up on the testing story as well.

[Johan Steenkamp]

Link to the article seems to have disappeared for me so here it is for reference: http://goo.gl/iQMWe

[Johan Steenkamp]

Hi Vojta

I also let the guys at  http://javascriptshow.com/ (https://twitter.com/#!/JavaScriptDaily) know about Angular.

Jason Siefer got back to me and said angular looks cool and they will talk about it in the next podcast.

[Vojta Jina]

That's awesome, thanks !

V.

[Jeffrey 'jf' Lim]

> --
> You received this message because you are subscribed to the Google Groups
> "AngularJS" group.
> To view this discussion on the web visit

> <snip>

thanks, but am I missing something here (like the original link)? I
assume you're referring to
http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/
?

-jf

--
http://richard.wilkinson.fr/?tag=fon SUCKS!!!

"Every nonfree program has a lord, a master --
and if you use the program, he is your master."
--Richard Stallman

"It's so hard to write a graphics driver that open-sourcing it would not help."
-- Andrew Fear, Software Product Manager, NVIDIA Corporation
http://kerneltrap.org/node/7228

[Johan Steenkamp]

Yes that is the link or use this one:  http://goo.gl/iQMWe

I'm not sure why the link in my original post seems to have dissappeared :(

[grig...@gmail.com]

Thanks for the information and success. <a href="http://www.kabbanet.ro/forum.php" title="forum kabbanet">http://www.kabbanet.ro/forum.php</a>

[grig...@gmail.com]

vineri, 25 mai 2012, 21:22:59 UTC+3, grig...@gmail.com a scris:

Thanks for the information and success. <a href="http://www.kabbanet.ro/forum.php" title="forum kabbanet">http://www.kabbanet.ro/forum.php</a>

Nice! I figured someone would come up with a simpler solution than mine.  Thanks for the information and success. http://sitedesignnet.ro

[grig...@gmail.com]

miercuri, 6 iunie 2012, 02:41:20 UTC+3, grig...@gmail.com a scris: Forum Kabbanet  Site Designnet

vineri, 25 mai 2012, 21:22:59 UTC+3, grig...@gmail.com a scris:

Thanks for the information and success. http://www.kabbanet.ro/forum.php   http://www.kabbanet.ro/forum.php

[grig...@gmail.com]

Thanks for the information and success. http://www.kabbanet.ro Forum Kabbanet  Site Designnet

 http://www.kabbanet.ro  http://sitedesignnet.ro

[Vojta Jína]

Well, then don't use isolate scope. Isolate scope is only meant for encapsulated components.

Ember doesnt' have directives. None of other frameworks I know have that. Write your own framework :-D

V.

On Mon, Jun 18, 2012 at 9:48 PM, ItsLeeOwen <l...@coderebelbase.com> wrote:

Does ember also have something like directives?  I'm fed up with angularJS forced isolated scopes when wanting to set widget properties by attributes.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.

To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/5qV4VrXJME8J.