JSFiddle - React, Tailwind, and code Playground

by merlinran

HTML

<script src="&lt;link href=&quot;http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.css&quot; rel=&quot;stylesheet&quot;&gt;"></script>
<div ng-app="myApp" >
  <div ng-controller="ctrl" >
    <p>controller</p>
    <p><a href ng-click="model.i = model.i + 1" >counter: {{model.i}}</a></p>

    <my-tabs>
      <p>tab transclude</p>
      <p><a href ng-click="model.i = model.i + 1" >counter: {{model.i}}</a></p>
    </my-tabs>
  </div>
</div>

JavaScript

angular.module('myApp', [])
  .controller('ctrl', function($scope) {
      $scope.model = {i : 10};
  })
  .directive('myTabs', function() {
    return {
      restrict: 'E',
      transclude: true,
      scope: {},
      controller: function($scope) {
      },
      template: '<div ng-transclude></div>'
    };
  });