0

2 時間前に開始しました: Nested HandlebarsJS #EmberJS の各ヘルパーが機能しない

自分で許容できる一時的な解決策を見つけた直後に、質問はまだ答えられていません. しかし、私の問題はそれだけではありませんでした。

私は今、オブジェクトの配列をループするカスタム ヘルパーを作成しようとしていますが、最初のインデックスを除外します - ほとんど: for(i = 1; i < length; i++) {}. コンテキストの長さを取得してオプションに渡す必要があるWebサイトを読んだことがあります-関数が次のように見えることを考慮してくださいforLoop(context, options)。

ただし、コンテキストは実際のオブジェクトではなく文字列です。を実行する.lengthと、配列のサイズではなく文字列の長さが得られます。それをオプションに渡すと、何も起こりません-ブラウザがフリーズすることは言うまでもありません。

getPath次に、オプションに渡す前に最初に実行しようとしましたが、これは空の文字列を返します。

代わりに何をすべきか、前に HandlebarsJS だけの for ループ コードを作成しましたが、それは機能しましたが、EmberJS はそれを受け入れないようです。なぜですか?

編集:私もほとんどフォローしました: http://handlebarsjs.com/block_helpers.html -> Simple Iterators

4

2 に答える 2

1

長い間試した後、私はこれを自分で解決しました。

HandlebarsJS メソッド (サイトで説明されているように) は、EmberJS に対して有効ではなくなりました。現在は次のようになっています。

function forLoop(context, options) {
    var object = Ember.getPath(options.contexts[0], context);
    var startIndex = options.hash.start || 0;

    for(i = startIndex; i < object.length; i++) {
        options(object[i]);
    }
}

for ループを拡張して、インデックス値を含めることもできます。

function forLoop(context, options) {
    var object = Ember.getPath(options.contexts[0], context);
    var startIndex = options.hash.start || 0;

    for(i = startIndex; i < object.length; i++) {
        object[i].index = i;

        options(object[i]);
    }
}

これは、可変開始インデックスを持つ機能する for ループです。テンプレートで次のように使用します。

{{#for anArray start=1}}
    <p>Item #{{unbound index}}</p>
{{/for}}
于 2012-04-26T12:44:17.060 に答える
0

これが私がやった方法です（そしてそれはうまくいきます!!!）

まず、モデルに「プレビュー」プロパティ/関数がありました。これは、arrayController を配列で返すだけです。

objectToLoop = Ember.Object.extend({ 
        ...
    arrayController: [],
    preview: function() {
        return this.get('arrayController').toArray();
    }.property('arrayController.@each'),
        ...
});

次に、新しいハンドルバー ヘルパーを追加します。

Handlebars.registerHelper("for", function forLoop(arrayToLoop, options) {
    var data = Ember.Handlebars.get(this, arrayToLoop, options.fn);

    if (data.length == 0) {
        return 'Chargement...';
    }

    filtered = data.slice(options.hash.start || 0, options.hash.end || data.length);

    var ret = "";
    for(var i=0; i< filtered.length; i++) {
        ret = ret + options.fn(filtered[i]);
    }
    return ret;     
});

そして、このすべての魔法のおかげで、自分のビューでそれを呼び出すことができます:

<script type="text/x-handlebars"> 
    <ul>
        {{#bind objectToLoop.preview}}
            {{#for this end=4}}
                <li>{{{someProperty}}}</li>
            {{/for}}
        {{/bind}}
    </ul>
</script>

以上です。

私はそれが最適ではないことを知っているので、それを改善する方法についてアイデアを持っている人は誰でも教えてください:)

于 2012-11-08T09:46:47.280 に答える