在ember中使用highlight.js

Using highlight.js in ember

本文关键字：highlight js ember      更新时间：2023-09-26

我的ember应用程序设置了左侧的帖子列表和右侧的单个帖子视图。当点击左边的一个帖子时，它的内容将呈现在右边的视图中。

这是我用来给文章添加语法高亮显示的代码。

App.PostView = Ember.View.extend({
  didInsertElement: function() {
    $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
  }
});

当第一个帖子视图被渲染时，它有语法高亮显示，但是当我点击另一个帖子，它的内容被加载到帖子视图时，语法高亮显示不被应用。我怎样才能使高亮应用于每次渲染的帖子?

没有更全面的例子，我只能猜测。右面板中生成的是PostView吗?如果是这样，那么你需要约束你的视图渲染到视图内部的东西。

在您的示例中，$('pre code')将针对文档中的所有pre code元素。试试this.$('pre code')，或者任何需要在视图中突出显示的元素/选择器。

这可能不是最干净的方法，但您可以尝试将观察者添加到控制器模型中，并进行必要的更改。但这只会在模型本身发生变化的情况下起作用。

: 

postHasChanged: function() {
    if (this.get('state') === 'inDOM') {
        $('pre code').each(function(i, e) {
            hljs.highlightBlock(e)
        });
    }
}.observes('controller.model')
相关文章：