JSFiddle - React, Tailwind, and code Playground

by Valentin Sarychev

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular.js"></script>
<div ng-app="ui" ng-controller="ctrl">
    <ui-popup buttons="buttons"></ui-popup>
    <button ng-click="onClick()">Add button</button>
</div>

JavaScript

angular.module('ui', []).directive('uiPopup', function() {
    return {
        replace: true,
        restrict: 'E',
        transclude: true,
        template: '<button ng-repeat="btn in buttons">{{btn.label}}</button>',
        scope: {
            buttons: '='
        }
    };
}).controller('ctrl', function($scope) {
    $scope.buttons = [];
    $scope.onClick = function() {
        $scope.buttons.push({ label: 'OK' });
    };
});