JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
<script src="http://code.angularjs.org/1.0.1/angular-resource-1.0.1.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
    <div ng-repeat="item in data"> 
        <my-dir model="item"></my-dir>
    </div>
    <br/>
    <div>{{data}}</div>
</div>

JavaScript

angular.module('myApp', ['ngResource'])

// API definition for obtaining the user script
//.factory('MyAPI', ['$resource', function($resource) {
//    return $resource('/_/doc/:docId', {docId: 123});
//}])

//.factory('DataSet', function(MyAPI) {
//    var results = MyAPI.get({docId: 123});   // query() b/c array result
//    return {userscript:results};
//})

// example data just to see a result when the JSFiddle is run
.factory('DataSet', function() {  
    return { answers: [ { id: 10,  y: "foo"}, { id: 11,  y: "bar"}, { id: 12,  y: "baz"},]};
})

.controller("MyCtrl", function($scope, DataSet) {    
    $scope.data = DataSet.answers;
})

.directive('myDir', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: { model: '=' },
        template: '<span>{{model.id}}: <input type="text" ng-model="model.y" ng-change="save()"></span>',
        link: function(scope, element, attrs) {
            scope.save = function() {
                console.log(" data to save:" + JSON.stringify(scope.model));
                //scope.model.$save();
            }
        }
    }
});