2

構文の強調表示に highlight.js を使用しようとしていますが、最初の読み込みでしか機能しません。

HTML:

<script type="text/x-handlebars" id="post">
 {{#if html}}
   {{rawhtml html}}
 {{else}}
   {{#each section}}
   {{rawhtml this}}
   {{/each}}
 {{/if}}
</script>

didInsertElement を使用すると、一度しか起動できません。

App.PostView = Ember.View.extend({
  didInsertElement: function () {
    hljs.initHighlightingOnLoad();
  }
});

デモ: http://jsbin.com/iKUrUWO/4 Code に移動し、次に 'CSS Best Practices' に移動します。ブラウザを更新します。構文の強調表示が表示されます (ピンクと紫)。「ファイルの命名」に移動して戻ります。これでコードは白に戻りました。

JSBIN: http://jsbin.com/iKUrUWO/4/edit?html,js

注: {{each}} ヘルパーのブロックレス形式を使用しようとしましたが、成功しませんでした。

<script type="text/x-handlebars" id="post">
 {{each controller postViewClass="App.PostView"}}
</script>

App.PostView = Ember.View.extend({
  template: Ember.Handlebars.compile('{{#if html}}{{rawhtml html}}{{else}}{{#each section}}{{rawhtml this}}{{/each}}{{/if}}'),
    didInsertElement: function () {
      hljs.initHighlighting();
    }
  });

そしてなぜか使えないthis.$().hljs.initHighlighting();。

私は混乱し始めているので、助けていただければ幸いです！ありがとう！

4

2 に答える 2

1

これには、計算されたプロパティを使用したいと思います。「Post」クラスで、正しい値とそれに続く .property 拡張子を返す関数を定義するだけです。

htmlContent: function() {
    var html= this.get('html');
    if (blah blah blah) {
        // do what you need to do to return the new content
    }
    return newValueToDisplay;
}.property('html')

次に、これをテンプレートに入れます。{{{htmlContent}}}

使えないとはthis.$().hljs.initHighlighting();言ってるけど、理由は言わないの？コンソールにメッセージ?

于 2013-12-26T17:49:37.103 に答える
0

ここでの問題は、ember コードが「jquery プラグイン」スタイルのコードとうまく混ざらないことだと思います。highlight.js には、いくつかのコードを取り、正しい強調表示でマークアップするだけの同期関数が利用できるようですhljs.highlightAuto('code')

次のような hljs 関数を使用してテキストを処理するハイライト ハンドルバー ヘルパーを作成してみます。
{{highlight model.html}}

于 2013-12-26T22:22:33.343 に答える