JSFiddle - React, Tailwind, and code Playground

by ahonaker

HTML

<script src="http://code.angularjs.org/1.0.0/angular-1.0.0.js"></script>
<div ng-app="app">
<div ng-controller="Ctrl">							

Selected : {{selected}}

<navtree items="organizations.children"></navtree>

</div>
</div>

JavaScript

var app = angular.module('app', []);

app.directive('navtree', function () {
	return {
		template: '<ul class="nav nav-list"><navtree-node ng-repeat="item in items | filter:query " item="item" selected="selected"></navtree-node></ul>',
		restrict: 'E',
		replace: true,
		scope: {
			items: '='
		}
	};
});

app.directive('navtreeNode', function($compile) {
	  return { 
	    restrict: 'E',
	    template: '<li><a ng-click="itemSelect(item._id)">{{item._id}} - {{selected}}</a></li>',
	    scope: {
	    	item: "=",
	    	selected: '='
	    },
	    controller: 'Ctrl',
	    link: function(scope, elm, attrs) {    	
	    	if ((angular.isDefined(scope.item.children)) && (scope.item.children.length > 0)) {
	    		var children = $compile('<navtree items="item.children"></navtree>')(scope);
	    		elm.append(children);
	    	} 
		} 
	  };
	});

function Ctrl($scope) {
	$scope.selected = "None";
	$scope.organizations =  {"_id":"SEC Power Generation","Entity":"OPUNITS","EntityIDAttribute":"OPUNIT_SEQ_ID","EntityID":2,"descendants":["Eastern Conf Business Unit","Western Conf Business Unit","Atlanta","Sewanee"],children:[{"_id":"Eastern Conf Business Unit","Entity":"","EntityIDAttribute":"","EntityID":null,"parent":"SEC Power Generation","descendants":["Lexington","Columbia","Knoxville","Nashville"],children:[{"_id":"Lexington","Entity":"OPUNITS","EntityIDAttribute":"OPUNIT_SEQ_ID","EntityID":10,"parent":"Eastern Conf Business Unit"},{"_id":"Columbia","Entity":"OPUNITS","EntityIDAttribute":"OPUNIT_SEQ_ID","EntityID":12,"parent":"Eastern Conf Business Unit"},{"_id":"Knoxville","Entity":"OPUNITS","EntityIDAttribute":"OPUNIT_SEQ_ID","EntityID":14,"parent":"Eastern Conf Business Unit"},{"_id":"Nashville","Entity":"OPUNITS","EntityIDAttribute":"OPUNIT_SEQ_ID","EntityID":4,"parent":"Eastern Conf Business Unit"}]},{"_id":"Western Conf Business Unit","Entity":"","EntityIDAttribute":"","EntityID":null,"parent":"SEC Power Generation","descendants":["Fayetteville","College Station","Baton...