$ compileでテンプレートURLを渡します

Question

私は以下のようなテンプレートの代わりに$ compileでテンプレートURLパスを渡す必要があるシナリオを持っています。

function addSubmenu() { 
    scope.subMenuAdded = true; 
    scope.subMenuVisible = true; 
    scope.menuItemClickHandler = function(menuItem) { 
     menuController.itemClickHandler.call(menuController, menuItem); 
    }; 
    $compile('<apt-expandable-menu data-menu="menuItem.children" data-on-menu-item-click="menuItemClickHandler" ng-if="subMenuVisible"></apt-expandable-menu>')(scope, function(cloned){ 
     element.append(cloned); 
    }); 
} 

$ compileの実際のテンプレートの代わりに、以下のようなテンプレートURLを渡す必要があります。

function addSubmenu() { 
    scope.subMenuAdded = true; 
    scope.subMenuVisible = true; 
    scope.menuItemClickHandler = function(menuItem) { 
     menuController.itemClickHandler.call(menuController, menuItem); 
    }; 
    $compile('./expandableMenuChildItem.template.html')(scope, function(cloned){ 
     element.append(cloned); 
    }); 
} 

とexpandableMenuChildItem.template.htmlで

：

<apt-expandable-menu data-menu="menuItem.children" data-on-menu-item-click="menuItemClickHandler" ng-if="subMenuVisible"></apt-expandable-menu> 

が、それは私にエラー投げている：

angular.js：14199エラー：構文エラーを、認識できない表現：./expandableMenuChildItem

.template.html任意の助けいただければ幸いです。

Answer 1

$templateRequestサービスを使用できます。そのような：

$templateRequest('nameOfTemplate.html').then(function(template){ 
    $compile(template)(scope, ..); 
});