Конкатентный шаблон с пользовательским шаблоном директивы

Question

Я не уверен, что его можно достичь, чего я хочу. Я попытаюсь объяснить это на примере:

пользовательские директивы:

appDirectives.directive("myTestDirective", 
    function() { 
     return { 
      restrict: "E", 
      templateUrl: "<div> Some template here... {{ testObject }} <div>", 
      scope: { 
       'testObject' = '@testObject' 
      } 
     }; 
    }]); 

Использование директивы в tempalte:

<my-test-directive testObject="And some more here..."> 
    <div> 
     I also want to be in the template! 
    </di> 
</my-test-directive> 

И я хочу, чтобы достичь этого шаблона:

<div> Some template here... And some more here... <div> 
<div> 
    I also want to be in the template! 
</di> 

Answer 1

Вы можете сделать это с помощью transclusion. Просто добавьте параметр в директиву и используйте ng-transclude для элемента, который вы хотите добавить.

Возможно, вам придется удалить некоторые оригиналы, поскольку для перехода требуется элемент для работы, но это основная идея.

angular.module('test', []) 
 
    .directive('myTestDirective', function() { 
 
    return { 
 
     restrict: "E", 
 
     template: "<div> Some template here... {{testObject}} <div><div ng-transclude></div>", 
 
     scope: { 
 
     testObject: '@' 
 
     }, 
 
     transclude: true 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="test"> 
 
    <my-test-directive test-object="And some more here..."> 
 
    <div> 
 
     I also want to be in the template! 
 
    </div> 
 
    </my-test-directive> 
 
</div>