javascript - ajax経由で呼び出されるページにangularJSディレクティブを設定するには?

Question

次のhtmlがあります(直接アクセスするか、ajax経由で呼び出すことができます):

<section id="content" ng-controller="setTreeDataCtrl" get-subthemes>
<dl ng-repeat="subtheme in allSubthemes">
    <dt>{{subtheme.Title}}</dt>
</dl>

次に、次のディレクティブを使用しています。

myApp.directive('getSubthemes', function() {
return function($scope, element, attrs) {
    $scope.allSubthemes = [];
    angular.forEach($scope.data.Themes, function(value, key) {
        angular.forEach(value.SubThemes, function(value2, key2) {
            $scope.allSubthemes.push({
                'ThemeTitle': value.Title,
                'ThemeUrlSlug': value.UrlSlug,
                'Title': value2.Title,
                'UrlSlug': value2.UrlSlug
            });
        });
    });
}
});

$scope.allSubthemes は問題ないようですが、DL はレンダリングされません。少しの間、すべてが適切にレンダリングされたことがわかりますが、{{subtheme.Title}} に戻ります。まるで「レンダリングされていない」ようです...私が間違っていることについて何か考えはありますか?

デモ jsFiddle: http://jsfiddle.net/HMP3a/