2016-04-26 16 views
1

knockoutカスタムバインディングハンドラを使って内側のdivの高さが外側のdivの高さよりも大きい場合にのみ、1つの外部スクロール関数を呼び出す必要があります。私のカスタム関数を使ったノックアウトカスタムバインディング

毎回自分のカスタムコードでこれを達成できますか?

のHTMLコードです:結合

<div class="ModifiedNotesListSection" style="height:300px;"> 
    <div class="Innerdiv" data-bind="EnscrollActive:{}">some dynamiic Content</div> 
</div> 

ノックアウトは次のとおりです。

ko.bindingHandlers.EnscrollActive = { 
      init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
       var ActualHeight = $(element).height(); 
       var ParentHeight = $(element).parents(".ModifiedNotesListSection").height(); 

        if (ActualHeight > ParentHeight) { 
         $(element).parents(".ModifiedNotesListSection").enscroll({ 
          verticalTrackClass: 'track4', 
          verticalHandleClass: 'handle4', 
          minScrollbarLength: 28 
         }); 
        } 
      } 
     }; 

:代わりにこのenscroll方法で、あなたが任意のjQueryのは、私の場合の条件内でクラスメソッドを追加記述することができます。

+0

div要素のいずれかの高さが変更されるたびにカスタムバインディングを実行する必要があります。 – elbecita

+0

@elbecita:はいまさに。 – Rayudu

+0

要素の高さはどうして変化しますか? – Tomalak

答えて

0

最終的にdiv要素の高さの変化を追跡し、内側のdivの高さが外側のdivの高さよりも大きい場合はいくつか行います。 div要素の高さが変わるたびに「醜い」部分に通知され、ノックアウトにはそのための箱の解決策がありません。 :(

あなたはそれを行う方法についてのこれらの答えをチェックし、すべてのX時間DOM要素の高さを追跡するために何かをコーディングするつもり必要です:。https://stackoverflow.com/a/9628472/4067893

そして、あなたはどちらかでき

  • カスタムバインディング
  • を使用するかカスタムバインディングを使用する必要なしに、enscroll fnをそのコードで直接実行します。カスタムバインディングinit fn内のdiv要素の高さをチェックするコードを入れます。チャンdivエレメントの高さが変わるたびにバインディング(data-bind="EnscrollActive: yourObservable")に送ります。最後のケースでは、update fnのカスタムバインディングを使用する必要があります。

私はそれが役に立ちそうです。

関連する問題