tutorial / directive

/**
 * Created by Administrator on 2015/4/17.
 */
angular.module("xn.directive.tree", [])
.directive("easyTree", [function() {
    var tpl = "<dl class='easyTree_dl' ng-init='active=true' ng-repeat='data in list'>"
        +"<dt ng-click='active=!active' class='easyTree_dt'><i class='icon' ng-class='active?\"icon-dash\":\"icon-add\"'></i>{{data.title}}</dt>"
        +"<dd ng-show='active' class='easyTree_dd {{child.cl}}' ng-click='choose(child)' ng-repeat='child in data.list'>{{child.value}}</dd>"
        +"</dl>";
    var link = function($scope, element, attrs, ngModel) {
        if(!ngModel) return;

        $scope.old = {};

        $scope.choose = function(obj) {
            if(obj) ngModel.$setViewValue(obj);
            if($scope.old && $scope.old.cl) $scope.old.cl="";
            obj.cl='easyTreeSelected', $scope.old=obj;
        };
    };
    var directive = {restrict: "AE",
        scope: {list: "="},
        require: "ngModel",
        template: tpl,
        link: link};
    return directive
}]);