2016-12-25 16 views
0

私はプロジェクトのすべてのページにホットタオルのデフォルトコードがありますが、今はMVC 5のビジュアルスタジオ2013でホットタオルテンプレートを使用しています以下のように見えるウェブサイトの設計:私はスクロールダウンしたときに、私はウェブの異なる部分を見ることができhttp://blackrockdigital.github.io/startbootstrap-stylish-portfolio/ をsite.but私はデュランダルを使用して、私は私が私の問題がある別のデータバインディングとデータバインドを組み合わせて使用​​

"data-bind="compose: { view: 'footer' }" 

使用する必要があると考えノックアウトしたい場合は、私のホーム・ページでこのコード行を使用し、次にfooter.htmlで別のタイプのデータ・バインディングを使用すると(テキスト・バインディングのような別のJavaスクリプト・ファイルもあります)、テキストは表示されません しかし、私はComposeバインディングを使用しない場合、それは動作します。 私は熱いタオルでほしいと思うもののようなWebページを作り、ノックアウトすることができます、ありがとうございます。

私のフッタービューは以下のようである:

<nav class="navbar navbar-fixed-bottom"> 
<div class="navbar-inner navbar-content-center"> 
    <span class="pull-left"><a href="http://johnpapa.net/spa" target="_blank">Learn how to build a SPA </a></span> 
    <span class="pull-right"> 
     <a data-bind="attr: { href: pm, title: title }"></a> 
    </span> 
</div> 
</nav> 

とfooter.js:

define(['services/logger'], function (logger) { 
var title = 'Home'; 
var pm = ko.observable('hi'); 
var vm = { 
    activate: activate, 
    title: title, 
    pm:pm 
}; 

return vm; 

//#region Internal Methods 

//#endregion 

});

<div> 
<header data-bind="compose: { view: 'nav' }"></header> 
<section id="content" class="main container-fluid" 
    data-bind="router: { transition: 'entrance', cacheViews: true }"> 
</section> 
<footer data-bind="compose: { view: 'footer' }"></footer> 
</div> 

しかし、私は私のプロジェクトを実行すると結果は以下の通りです:

は、彼らはちょうど私がそこにフッタを見たいと思っ結果

と私のメインページをチェックするためのとても簡単です

result

答えて

0

問題は、あなただけのフッターが使用するviewではなく、関連する01を指定しているということですview

だから、あなたはあなたのcomposeがそうのように結合更新したい -

"data-bind="compose: { view: 'footer', model: 'footer' }"

しかし私は、2つの結合方法を活用するためにあなたのviewと対応modelを保存するためにobservableを使用することをお勧め。

だから、viewModelメインに、あなたはobservableがそうのように定義されているだろう - そして

self.footer = ko.observable({ 
    view: 'footer', 
    model: 'footer', 
    activationData: anyDataYouWouldLikeToInitializeYourFooterWith 
}); 

そして、あなたのcomposeはそうのような結合更新 -

"data-bind="compose: footer"

この方法は、あなたができますcompose異なるビューを動的に表示します(すべてが一度に1つずつ表示される場合)。

関連する問題