AngularJS - рендеринг нескольких строк и HTML-файлов в одном теге

Question

Я хочу отображать файлы шаблонов (просмотр + контроллер) и несколько строк html вместе в одном теге. - Так что у меня есть несколько строк, как

<p>some text</p> 

и HTML-файлов + контроллер как

template.html + template.controller.js 

Я хочу сделать строки и template.html в один тег.

Я уже связала HTML строк и я в состоянии вынести их с

<div ng-bind-html="template" ..></div> 

Могу ли я сериализации HTML-файлы и сделать его в нг-Bind-HTML тоже? Эти файлы имеют собственные контроллеры:

<div ng-controller="sampleCtrl"> 

Они потеряли бы функциональность?

ПРИМЕЧАНИЕ: порядок элементов важен! Например, я хочу отобразить строку, затем содержимое файла, а затем снова строку.

Большое спасибо!

Answer 1

Вы должны использовать директивы. Это позволит вам загрузить файл html с помощью связанного js-файла. Вы можете установить scope.someText в директиве и вызвать ее в представлении, например.

<p>{{someText}}</p> 

Директива:

var app = angular.module('myApp'); 

app.directive('someTextDirective', function(){ 
    return{ 
     restrict: 'E', 
     templateUrl: 'path/to/html/file.html', 
     link:function(scope){ 
       scope.someText = 'blah'; 
     } 
    } 
}); 

Просто вызовите директиву в вашем HTML:

<some-text-directive></some-text-directive> 

Надеется, что это помогает. Если я не был ясен, дайте мне знать, и я сделаю все возможное, чтобы уточнить.