표준 호출 맞춤 바인딩에서 녹아웃 클릭 바인딩

Question

KnockoutJS에서 '조건부 클릭'바인딩을 만들고 싶습니다. 기본적으로 Knockout에서 사용하는 것처럼 표준 클릭 바인딩이지만 첨부 된 함수를 실행하려면 조건을 충족해야합니다. 필자의 경우 가장 좋은 방법은 사용자 정의 바인딩 핸들러를 작성하여 허용되는 경우 표준 클릭 바인딩을 호출하는 것입니다.

ko.bindingHandlers.safeClick = { 
    'init': function(element, valueAccessor, allBindingsAccessor, context) { 
     $(element).click(function() { 
      if(mycondition == true) { 
       // call the standard click binding here -> this is the part I don't know 
      } 
     }); 
    } 
} 

내 모든 표준 클릭 바인딩을이 사용자 지정 바인딩으로 바꾸려고합니다. 따라서 올바른 방식으로 클릭 바인딩을 호출하는 것이 중요하므로 HTML에 제공된 모든 매개 변수가 함수로 전달됩니다. 예를 들어 사용자 지정 바인딩에서 누락 된 부분 좀 도와 수 있다면

<a href="#" data-bind="click: basevm.gotopage.bind($data, '#homepage')">Home</a> 
<a href="#" data-bind="click: itemvm.activateItem">Activate</a> 

이 나는 ​​대단히 감사하겠습니다

<a href="#" data-bind="safeClick: basevm.gotopage.bind($data, '#homepage')">Home</a> 
<a href="#" data-bind="safeClick: itemvm.activateItem">Activate</a> 

로 대체해야합니다.

ko.bindingHandlers.click.init(element, valueAccessor, allBindingsAccessor, context); 

편집 :

Answer 1

올바른 방법은 여기 기다리고 클릭을 위임하는 것은 다음과 같다 :

• 원래 함수를 사용합니다 (예 : valueAccessor() 사용)
• 새 valueaccessor 함수를 작성하여 조건을 포함하는 새 함수를 리턴 한 다음 원래 함수를 호출하십시오. 이 새로운 값 접근자를 click 바인딩에 전달합니다.

그래서 safeClick는 다음과 같이 표시됩니다

ko.bindingHandlers.safeClick = { 
    'init': function (element, valueAccessor, allBindingsAccessor, 
         viewModel, bindingContext) { 
     var originalFunction = valueAccessor(); 
     var newValueAccesssor = function() { 
      return function() { 
       if (mycondition == true) 
        //pass through the arguments 
        originalFunction.apply(viewModel, arguments); 
      } 
     } 
     ko.bindingHandlers.click.init(element, newValueAccesssor, 
      allBindingsAccessor, viewModel, bindingContext); 
    } 
} 

데모 JSFiddle합니다.

이것은 첫 번째 클릭에 대해 작동하며 click 이벤트에 수동으로 가입하거나 jQuery로 트리거 할 필요가 없습니다.

Answer 2

당신은 다음과 같이 호출 할 수 있습니다 당신은 mannualy 수있는 이벤트를 처음 클릭 전화 :

ko.bindingHandlers.safeClick = { 
    'init': function(element, valueAccessor, allBindingsAccessor, context) { 
     $(element).click(function() { 
      if(mycondition == true) { 
       ko.bindingHandlers.click.init(element, valueAccessor, allBindingsAccessor, context); 
      } 
     }); 
     if(mycondition == true) { 
      $(element).trigger('click'); 
     } 
    } 
}