angularjs - 非同期にロードされたテンプレートで angular-translate を使用する

Question

アプリでangular-translateを使用しています。angular-uiを使用してコンテンツを動的に切り替えることができるタブを使用します。$http を使用するカスタム サービスを介してコンテンツを取得します。

テンプレートはサニタイズされ、後でレンダリングするために配列にプッシュされます。

 var addNewTab = function(template, tabClass) {
   var id = $scope.tabs.length + 1;
   tabClass = tabClass || '';
   template = $sce.trustAsHtml(template);
   template = $compile(template)($scope);

   $scope.tabs.push({
     id: id,
     name: 'PLACEHOLDER TITLE',
     active: true,
     content: template,
     tabClass: tabClass
   });
 };

{{tab.content}} でレンダリングされたビューでは、この時点までのすべてが非常にうまく機能します。私が抱えている問題は、新しく挿入されたテンプレートを翻訳するために angular-translate を取得することです。

テンプレート内では翻訳ディレクティブを使用して翻訳していますが、テンプレートは翻訳が行われる場所の $scope の外にあるため、そのテキストはレンダリングされません。

$compile を使用して動作させることができると思っていましたが、使用方法がよくわかりません。

どんなアイデアでも大歓迎です。