JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/coreyti/showdown/master/compressed/showdown.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<div ng-app="myApp" ng-controller="SampleCtrl">
    <markdown ng-model="someCode">
    </markdown>
    
    <textarea ng-model="someCode" style="width:400px;height:200px;"></textarea>
</div>

JavaScript

angular.module('myApp', [])
    .directive('markdown', function() {
        var converter = new Showdown.converter();
        var link = function(scope, element, attrs, model) {
            var render = function(val){            
                console.log('value:', val, 'modelValue:', model.$modelValue);
                var htmlText = converter.makeHtml(model.$modelValue || '');
                element.html(htmlText);
            };
            scope.$watch(attrs['ngModel'], render);
            render();        
        };
        return {
            restrict: 'E',
            require: 'ngModel',
            link: link
        }
    })
    .controller('SampleCtrl', 
        function($scope){
            $scope.someCode =  "# Hello World!\n- Zeppelin\n- That guy\n- Kronos\n";           
        });