JSFiddle - React, Tailwind, and code Playground

by scispear

HTML

<script src="https://raw.github.com/wycats/handlebars.js/1.0.0-rc.3/dist/handlebars.js"></script>
<script src="https://raw.github.com/emberjs/ember.js/release-builds/ember-1.0.0-rc.3.js"></script>
<script type="text/x-handlebars" data-template-name="daView">
    A 
    <span {{bindAttr class="view.letter"}}>B</span>
    <span {{bindAttr class="view.asset.letter"}}>C</span>
    D
</script>

CSS

.blue {
    color: blue;
}

.green {
    color: green;
}

JavaScript

window.App = Ember.Application.create();

var obj = Ember.Object.extend({
    letter: function(){
        return "green";
    }.property()
});

var view = Ember.View.extend({
    templateName: "daView",
    asset: null,
    
    letter: function(){
        return "blue";
    }.property("asset.letter")
});

v = view.create({});
v.set("asset", obj.create({}));
v.append();