Question

我正在使用此示例 - fiddle。我想要实现它以动态填充我的Angular的重复日期中的日期。该示例是一个工作示例，但它不支持数据绑定。以下是我的代码：

JS

.directive('markdown', function () {
    var converter = new Showdown.converter();
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            console.log(element.text()); //Prints out {{post.article}}
            var htmlText = converter.makeHtml(element.text());
            element.html(htmlText);
        }
    };
})

HTML

<div ng-repeat="post in posts">
    <div markdown>{{post.article}}</div> <!-- Output: ##Testing -->
    <div markdown>**Testing**</div>      <!-- Output: <strong>Testing<strong>-->
</div>

在该代码的评论中是结果。第一个输出没有按预期进行。我在这里做错了什么或者我错过了什么？

来自控制台的注释

outerHTML: "<div markdown="" class="ng-binding"><p>{{post.article}}</p></div>"
outerText: "{{post.article}}↵↵"

outerHTML: "<div markdown=""><strong>Testing</strong></div>"
outerText: "Testing↵"

注意：检查JS中的注释，console.log（element.text（））;

Answer 1

找到了我的解决方案的替代方案：

包括Angular Sanitize Js和Markdown Converter Js

JS

$scope.converter = new Markdown.Converter();
$scope.convert = function(markdown) {
    return $scope.converter.makeHtml(markdown);
}

HTML

<div ng-bind-html="convert(post.article)"></div>

Markdown不会使用Angular的数据绑定进行渲染

1 个答案: