html部分

<div ng-app="myApp" ng-controller="clickShow" ng-cloak>
    <expander expander-title="expander.title" ng-repeat="expander in expanders">
        {{expander.text}}
    </expander>
</div>

js部分

var app=angular.module("myApp",[]);
app.directive("expander",function(){
    return{
        restrict:"EA",
        replace:true,
        transclude:true,
        scope:{
            title:"=expanderTitle"
        },
        template:"<div >"
        +"<div ng-click='toggle()'>{{title}}</div>"
        +"<div ng-show='showMe' ng-transclude></div>"
        +"</div>",
        link:function(scope,element,attrs){
            scope.showMe=false;
            scope.toggle=function toggle(){
                scope.showMe=!scope.showMe;
            }
        }
    }
})
app.controller("clickShow",function($scope){
    $scope.expanders=[
        {title:"1dfs",text:"dfadfad"},
        {title:"2dfs",text:"dfadfad"},
        {title:"3dfs",text:"dfadfad"}
    ]
});