JSFiddle - React, Tailwind, and code Playground

by scriptstar

HTML

<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/5152028/foundation.css">
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-app="app">
   
    <div ng-controller="FirstCtrl">
        <input type="text" ng-model="data.message" />
        <h1>{{data.message}}</h1>
    </div>     
    
    <div ng-controller="SecondCtrl">
        <input type="text" ng-model="data.message" />
        <h1>{{reversedMessage}}</h1>
    </div>
</div>   

        
 <!--start typing in the textbox in the results pane -->

JavaScript

var app = angular.module('app', []);
app.factory('Data', function () {
    return {
        message: "I am data from a factory"
    }
});

app.filter('reverse', function(){
    return function(text){
        text.split("").reverse().join("");
    }
});

function FirstCtrl($scope, Data) {
    $scope.data = Data;
}

function SecondCtrl($scope, Data) {
    $scope.data = Data;
    $scope.reversedMessage = function(){
        return $scope.data.message.split("").reverse().join("");
    }
}