AngularJS : transcluding multiple sub elements in a single Angular directive

Question

I am Fairly new to Angular but have been reading quite a lot. I was reading about ng-transclude at http://docs.angularjs.org/guide/directive#creating-custom-directi

Answer 1

Starting Angular 1.5, it's now possible to create multiple slots. Instead of transclude:true, you provide an object with the mappings of each slot:

https://docs.angularjs.org/api/ng/directive/ngTransclude

angular.module('multiSlotTranscludeExample', [])
 .directive('pane', function(){
    return {
      restrict: 'E',
      transclude: {
        'title': '?pane-title',
        'body': 'pane-body',
        'footer': '?pane-footer'
      },
      template: '
' +
                  '
Fallback Title
' +
                  '
' +
                  '
Fallback Footer
' +
                '
'
    };
})