Kontrolka

/// <reference path="jquery.d.ts" />

interface  IDynamicItem {

}


        class DynamicMenu {
            private target: HTMLElement;
            private items: Array<DynamicMenuItem>;

            constructor(target: HTMLElement) {
                this.target = target;
                this.items = new Array();
            }

            addItem(item: DynamicMenuItem) {
                this.items[this.items.length] = item;
            }

            render() {
                var content: string;
                content = '    <div class="dropdown">' +
                    '<button class="btn btn-default dropdown-toggle" type = "button" id = "dropdownMenu1" data-toggle = "dropdown" >Dropdown<span class="caret" ></span ></button >' +
                '<ul class="dropdown-menu" role = "menu" aria - labelledby = "dropdownMenu1" >';

                //var item: any;
                for ( var i = 0; i < this.items.length; i++) {
                    content += this.items[i].render();
                    //document.write(v);
                }

                content += '</ul ></div > ';

                //return content;

                this.target.innerHTML = content;
                //$(content).appendTo(this.target);
            }


        }

        class DynamicMenuItem {
            public show: boolean = true;
            private caption: string;
            private value: string;
            private tag: string;

            constructor(caption: string, value: string, tag: string) {
                this.caption = caption;
                this.value = value;
                this.tag = tag;
            }

            render() {
                var res: string;
                res = '<li role = "presentation" ><a role = "' + this.tag + '" tabindex = "-1" href = "' + this.value + '" > ' + this.caption + ' </a></li>';
                return res;
            }
        }




$(document).ready(() => {

    var item1: DynamicMenuItem = new DynamicMenuItem('Pozycja pierwsza', 'adres1', 'menuitem');
    var item2: DynamicMenuItem = new DynamicMenuItem('Pozycja druga', 'adres2', 'menuitem');
    var item3: DynamicMenuItem = new DynamicMenuItem('Pozycja trecia', 'adres3', 'menuitem');

    var menu: DynamicMenu = new DynamicMenu(document.getElementById("clickdiv"));
    menu.addItem(item1);
    menu.addItem(item2);
    menu.addItem(item3);

    menu.render();


});