

Ask HN: Angular/Knockout/Ember, logic in templates, and maintenance - rudasn

I am astonished by the really positive feedback these frameworks are getting lately on HN and other places.<p>For sure, they tackle a common problem and offer some really sleek solutions but the one thing that really bothers me is their use of HTML and templates:<p><pre><code>    &#60;a href="#" {{ action "edit" target="parentView" }}&#62;Edit&#60;/a&#62;
</code></pre>
Or something along those lines.<p>What is really the difference between the previous line of code and this:<p><pre><code>    &#60;a onclick="doSomething"&#62;Click me!&#60;/a&#62;
</code></pre>
Their use of HTML as something that it is not reminds me of ColdFusion and the really unreadable and unmaintainable HTML it required.<p>So I really have to ask, what happened to separation of concerns and using HTML for markup, CSS for styling, and JavaScript for behavior?<p>Why is mixing markup and behavior so appealing? Or is it just something you live with in order to benefit from other aspects of these frameworks?<p>How maintainable is the code you produce using these frameworks?
======
hasenj
I never found merit to the point about not putting logic in templates.

The impressive feature of knockout (and angular) is automatic updating of UI
when model data changes.

Knockout calls it "viewmodel", that is, the model is not necessarily your data
model (though it could be!) but rather it's a model for the view: the state of
the viewmodel determines the state of the UI.

Why would you say that this is wrong?

It even has a wikipedia page:
<http://en.wikipedia.org/wiki/Model_View_ViewModel> (not that this matters,
but it's a counter argument to "it's not standard").

~~~
rudasn
I love the idea of viewmodel and automatic UI updates! What I don't really
like is the implementation of that concept by these three frameworks.

For example, from Knockout's homepage: <http://knockoutjs.com/img/homepage-
example.png>

That mixing of HTML and JS variables (in data-bind: chosenTicket, tickets) and
behavior (click: resetTicket) looks very alien to me. It just doesn't feel
right.

It does make automatic UI update very very easy to implement but at what cost?
Is code like this maintainable? Is it easily testable? Does is scale well?

~~~
hasenj
Haven't used knockout heavily yet (but I plan to!).

From what I can tell (mostly by intuition and experience), this looks at least
more maintainable than typical MVC systems like Backbone.js

------
pixelcort
Not sure about Angular and Knockout, but in Ember the convention is for
actions to target a state manager by default. This means you can handle the
action differently depending on what state you're in. You could think of it as
the action being just a custom event type that a state can sign up for.

I wouldn't consider actions in the template to be logic; if the actual event
handler were in the template then I'd see a concern.

I like to think about it like a cycle: the template actions are received by
the states, which make changes to the models and controllers, which update the
views and templates.

------
techtrainer
I have been working with angular recently and it has helped me get good
separation on action binding if JavaScript function and element (which
otherwise could end up heavily in JavaScript and pose challenge to maintain).

