srcがテンプレート用に機能しないのはなぜですか？

Question

HTMLスクリプトタグは、名前付きテンプレートを定義するために使用することができます。

<script type="text/html" id="Lookup"> 
    <label class="field-title" data-bind="text: Metadata.FieldTitle, css: { hasError: !IsValid() }"></label> 
    <div data-bind="html: Metadata.FieldIntro"></div> 
    <select class="form-control" data-bind="attr: { id: 'ff' + Metadata.FormFieldID }, options: Lookup, optionsText: 'Caption', optionsValue: 'Id', optionsCaption: Metadata.FieldIntro || 'Select an item...', value: Value, css: { hasError: !IsValid() }"></select> 
    </script> 

MDNとMSDNによると、私は、ファイルにテンプレートの内容を移動することができるはずですし、このようにそれを参照：

<script type="text/html" id="Lookup" src="Lookup.html"></script> 

フィドラーテンプレートファイルには、がロードされています（いくつかあります）。テンプレートがインラインでないときにノックアウトを使用するのを止め、それについて何かできることはありますか？

コメントから、scriptタグはDOMに読み込まれる内容を解析しません。 jQuery ajaxのようなものをロード、解析、注入することができますが、ノックアウトはスクリプトノードのIDを使用してテンプレートを参照するため、次の問題はそのようにフラグメントを表示する方法です。

$(document.body) 
.append("<div id='Lookup' style='display:none'></div>") 
.load("Templates/Lookup.html"); 

閉じる、ない葉巻：私はこのような何かをする必要があると推測刺しで

。ここで修正され、関数としてラップされます：

function loadTemplate(name) { 
    if (name) 
    switch (name.constructor) { 
     case String: 
     $(document.body).append("<div id='" + name + "' style='display:none'></div>"); 
     $("#" + name).load("Templates/" + name + ".html"); 
     break; 
     case Array: 
     name.map(loadTemplate); 
     break; 
     default: 
     throw "Must be a string or an array of strings"; 
    } 
} 

単一のテンプレート名または名前の配列を渡すことができます。 ノックアウトは喜んでテンプレートを使用します。

Answer 1

ブラウザでは、text/htmlで書かれたプログラムの処理方法はわかりません（はい、その文章はあまり意味がありません。これはあなたが使用しているハックです）。

テンプレートを処理するために使用しているJavaScriptは、DOM内のscript要素の子ノードを読み取っています。 src属性をチェックして外部コンテンツを読み込むようには書かれていません。