Как получить доступ к слотам включения из функции transclude?

Question

В Angular 1.5 введено многослотовое включение. Согласно документам:

объект transclude { slotA: '?myCustomElement' } отображает элементы в слот slotA, к которому можно получить доступ через функцию $transclude

К сожалению, это не дает никаких примеров этого. Единственный пример, который он приводит, вообще не упоминает слоты:

$transclude(function(clone, scope) {
  element.append(clone);
  transcludedContent = clone;
  transclusionScope = scope;
});

Может кто-нибудь пролить свет на то, как получить доступ к каждому слоту с помощью функции $transclude?

Answer 1

У меня была похожая проблема, но помогает чтение исходного кода ng-transclude. Оказывается, есть третий аргумент функции $ transclude, который является именем слота.

https://github.com/angular/angular.js/blob/master/src/ng/directive/ngTransclude.js#L190

Простой пример:

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

angular
  .module('app')
  .directive('dir', function () {
    return {
      transclude: {
        a: 'aT',
        b: 'bT'
      },
      link: function (scope, elem, attrs, ctrl, transclude) {
        transclude(function (content) {
          elem.append('<div>a</div>');
          elem.append(content);
        }, null, 'a');
        
        transclude(function (content) {
          elem.append('<div>b</div>');
          elem.append(content);
        }, null, 'b');
      }
    };
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.js"></script>

<div ng-app="app">
  <dir>
    <a-t>content of a</a-t>
    <b-t>content of b</b-t>
  </dir>
</div>