JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
    <div  data-ng-app="app">
        <panel1>
            
        </panel1>
    </div>

JavaScript

var app = angular.module('app', []);
        app.directive('panel', function ($compile) {
            return {
                restrict: "E",
                replace:true,
                transclude: true,
                template: "<div ng-transclude >fsafsafasdf</div>",
                link: function (scope, elem, attrs) {
                }
            }
        });
        app.directive('panel1', function ($compile) {
            return {
                restrict: "E",
                template:"<div></div>",
                link : function(scope,element){
                    var html = "<panel><input type='text' ng-model='firstName'>{{firstName}}</panel>";
                    element.append(html);
                    $compile(element.contents())(scope);
                }
            }
        });