0

ユーザー画像の先行入力をホーガン テンプレートにバインドしていますが、コードは実際には正常に動作しますが、リソースを取得しようとするとコンソールでエラーが発生します: localhost:####/%7B%7BuserBlankImgUrl%7D%7D

意味のある唯一のことは、値を待つのではなく、テンプレート値にバインドしようとしていることです。

完全な開示：私のアプリはDurandalJSとknockoutJSをかなり頻繁に使用していますが、以下に関連するコードを表示しようとしました. 提案に基づいてさらに追加します。

テンプレート： 

<img class="quarc-avatar-list-item" src="{{userBlankImgUrl}}" />

JS:

    self.userImgUrl = ko.computed(function () {
        return avatar.fromGravatar(self.email(), self.gender());
    });

私が試した他のことは次のとおりです。

  1. テンプレートを null チェックでラップすると、バインドしようとしなくなります。
  2. テンプレート hmtl を削除すると、ブラウザー コンソールにリソース エラーが表示されません。
  3. 他のオプションを探すために、より多くのホーガンと先行入力オプションを学習しようとしました。事前レンダリングやデフォルトの「ローカル」値の設定が役立つかどうかわかりませんか?

ありがとう、

-クリス

4

1 に答える 1

1

私が最初に気付くのは、テンプレートで使用されているものself.userImgUrlと同じではないuserBlankImgUrlということです。これが意図的なものである場合、投稿されたスニペットからは明らかではありません。

ただし、ある時点で、スクリプトはテンプレート オブジェクトのメソッドを介して実行せずにテンプレートを出力しています。render()不適切なリクエストは、画像タグの src 属性が文字どおり「{{userBlankImgUrl}}」であることが原因です。ローカルサーバーでアプリをテストしていると推測しているので、検索するアドレスは次のとおりですhttp://localhost/.../{{userBlankImgUrl}}（質問の ### がパスを短縮/非表示にするだけでなく、実際にlocalhostからリクエストしている場合を除きます:# ###/%7B%7BuserBlankImgUrl%7D%7D - いずれにしても問題 (または少なくともその一部) は同じです)。

Hogan.js は、レンダリングするテンプレートに表示される未定義のハンドルバー変数を削除します。

var template = Hogan.compile(
    '<img class="quarc-avatar-list-item" src="{{undefinedVariable}}" />'
);
console.log( template.render({var1: "Test", var2: "Again"}) );

コンソールに出力します:

<img class="quarc-avatar-list-item" src="" />

{{templateVar}}src 属性、nullまたは または値が指定された場所に何かが表示された場合undefined、適切なレンダリング メソッドを経由せずにテンプレートが出力されたことがわかります。

于 2013-10-19T10:14:34.153 に答える