Angularjs 指令中的指令

我有一个定制的降价指令，效果很好。现在，我想在通过markdown指令加载的内容中使用自定义youtube指令。youtube指令本身工作正常，但一旦我将其放入markdown文件中，它就会被angular忽略

---

以下操作很好（但不是我想做的）：

.html

---

以下是我想做的（但不起作用）：

.html

youtube：

app.directive('myYoutube', function( $sce ) {
  return {
    restrict: 'EA',
    scope: { code:'=' },
    replace: true,
    template: '<div style="height:400px;"><iframe style="overflow:hidden;height:100%;width:100%" width="100%" height="100%" src="{{url}}" frameborder="0" allowfullscreen></iframe></div>',
    link: function (scope) {
        scope.$watch('code', function (newVal) {
           if (newVal) {
               scope.url = $sce.trustAsResourceUrl("http://www.youtube.com/embed/" + newVal);
           }
        });
    }
  };
});

app.directive（'myYoutube'，函数（$sce）{
返回{
限制：“EA”，
作用域：{code:'='}，
替换：正确，
模板：“”，
链接：功能（范围）{
范围：$watch（'code'，函数（newVal）{
if（newVal）{
scope.url=$sce.trustAsResourceUrl（“http://www.youtube.com/embed/“+newVal）；
}
});
}
};
});

您确实使用

markdown

指令将DOM添加到

.md

文件中，但由于未编译，angular不会注册它

像这样的方法应该会奏效：

$http.get('modules/test/files/' + link).success(function(response)
{
    var htmlText = converter.makeHtml(response);
    element.html(htmlText);
    $compile( element.contents() )( scope );
    return element;
});

---

在源代码上使用

$compile

：因此您可能需要

$compile

标记返回的HTML。这似乎可以修复它。非常感谢。

<div markdown link="contentfile.md">
</div>

markdown content here

<div my-youtube code="'videoidhere'"></div>

more markdown content here

app.directive( 'markdown', function( $http ) {
    var converter = new Showdown.converter();
    return {
        restrict: 'A',
        scope: { link: '@' },
        link: function ( scope, element, attrs ) 
        {   
            attrs.$observe('link',function(link)
            {
                $http.get('modules/test/files/' + link).success(function(response)
                {
                    var htmlText = converter.makeHtml(response);
                    return element.html(htmlText);
                });
            });
        }
    };
});

app.directive('myYoutube', function( $sce ) {
  return {
    restrict: 'EA',
    scope: { code:'=' },
    replace: true,
    template: '<div style="height:400px;"><iframe style="overflow:hidden;height:100%;width:100%" width="100%" height="100%" src="{{url}}" frameborder="0" allowfullscreen></iframe></div>',
    link: function (scope) {
        scope.$watch('code', function (newVal) {
           if (newVal) {
               scope.url = $sce.trustAsResourceUrl("http://www.youtube.com/embed/" + newVal);
           }
        });
    }
  };
});

$http.get('modules/test/files/' + link).success(function(response)
{
    var htmlText = converter.makeHtml(response);
    element.html(htmlText);
    $compile( element.contents() )( scope );
    return element;
});