ko.utils.unwrapObservable을 언제 사용합니까?


114

KnockoutJS를 사용하여 몇 가지 사용자 지정 바인딩을 작성했습니다. ko.utils.unwrapObservable(item)코드를 보면 언제 사용할지 아직 확실하지 않습니다 . 그 호출은 기본적으로 item관찰 가능 여부를 확인합니다 . 그렇다면 value ()를 반환하고 그렇지 않은 경우 값을 반환합니다. 사용자 정의 바인딩 생성에 대한 Knockout 섹션을 살펴보면 다음과 같은 구문이 있습니다.

var value = valueAccessor(), allBindings = allBindingsAccessor();
var valueUnwrapped = ko.utils.unwrapObservable(value);

이 경우 observable을 통해 호출 ()하지만 ko.utils.unwrapObservable. 나는 한 대 다른 것을 사용할 때 또는 항상 위의 패턴을 따르고 둘 다 사용 해야하는지에 대한 핸들을 얻으려고합니다.

답변:


142

ko.utils.unwrapObservable관찰 가능 여부를 알 수없는 경우에 사용해야합니다 . 이것은 일반적으로 관찰 가능 또는 관찰 불가능이 바인딩 될 수있는 사용자 지정 바인딩에 있습니다.

위에있는 코드에서 호출 valueAccessor()은 실제로 Observable을 풀지 않습니다. 올바른 컨텍스트에서 바인딩에 전달 된 값을 검색하는 것뿐입니다 (보호하기 위해 함수에 래핑 됨). 의 반환 값은 valueAccessor()관찰 가능 여부 일 수 있습니다. 바인딩에 전달 된 모든 것입니다.


4
상황에 따라 다릅니다. 일부 사용자 지정 바인딩은 관찰 가능 항목에서만 작동하도록 설계되었으므로 관찰 가능 항목인지 확인하고 (ko.isObservable) 확인한 다음 ()로 자유롭게 래핑을 해제 할 수 있습니다. 중첩 된 Observable이있을 수있는 객체를 수신하는 경우, 객체 의 래핑되지 않은 버전을 위젯이나 타사 라이브러리로 전달하려는 경우를 ko.toJS(yourObject)사용 하는 것보다를 사용 하는 것이 좋습니다 ko.utils.unwrapObservable. 일반적으로 ko.utils.unwrapObservable관찰 가능 항목과 관찰 불가능 항목을 지원하는 데 사용하는 것이 가장 안전합니다 .
RP Niemeyer

2
목적이 무엇인지 혼란 스럽습니다 ko.utils.unwrapObservable. 코드를 살펴보면 관찰 가능한지 확인하고 관찰 가능한 경우 Knockout은 ()관찰 가능한 값을 가져 오기 위해 호출 합니다. 그렇지 않으면 관찰 불가능한 값을 반환합니다. 내가 관심있는 것이 바인딩에 전달 된 데이터의 값인 경우 왜 항상 사용할 수 ()없습니까?
arb

17
바인딩에서 observable 또는 non-observable이 전달되고 있는지 알 수 없습니다. 내가 가지고 myBinding있고 누군가가 예를 들어 data-bind="myBinding: myValue". myValue관찰 가능하거나 뷰 모델의 일반 속성 일 수 있습니다. 그것이 단지 속성이고 함수처럼 호출하면 오류가 발생합니다. ko.utils.unwrapObservableObservable이 전달되었는지 여부에 관계없이 안전하게 값을 반환합니다.
RP Niemeyer

10
또한 'ko.utils.unwrapObservable'이 매우 긴 표현식이기 때문에 'ko.unwrap'속기를 사용하는 것이 좋습니다.
Ivan Nikitin

3
@IvanNikitin-확실히, ko.unwrap3.0 이상에서 사용할 수 있음 을 지적하고 싶었습니다 . 3.0 이전 버전을 사용하는 경우 ko.utils.unwrapObservable여전히 있습니다.
RP Niemeyer 2014 년

12

이전 답변은 정확하지만 종종 사용자 지정 바인딩 (권한을 확인하거나 다른 것을 기반으로 수행 할 작업을 결정하는 함수 등)에 함수를 전달합니다. 내가 정말로 필요한 것은 관찰 가능하지 않더라도 모든 함수를 풀기위한 것이었다.

다음은 모든 것을 재귀 적으로 풉니 다.

ko.utils.unwrapFunction = function (func) {
    if (typeof func != 'function') {
        return func;
    }
    else {
        return ko.utils.unwrapFunction(func());
    }
};

다음은 내가 작성한 간단한 사용자 지정 바인딩의 예입니다.

//replaces single and double 'smart' quotes users commonly paste in from word into textareas and textboxes with normal text equivalents
//USAGE:
//data-bind="replaceWordChars:true
//also works with valueUpdate:'keyup' if you want"

ko.bindingHandlers.replaceWordChars = {
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var bindingValue = ko.utils.unwrapFunction(valueAccessor);

        if (bindingValue) {
            $(element).val(removeMSWordChars(allBindingsAccessor().value())); //update DOM - not sure why I should need to do this, but just updating viewModel doesn't always update DOM correctly for me
            allBindingsAccessor().value($(element).val()); //update viewModel
        }
    }
}

이런 식으로 bindingValue는 항상 값을 포함합니다. 함수, 옵저버 블, 값 또는 옵저버 블 내부의 함수를 전달했는지 걱정할 필요가 없습니다. 이것은 내가 원하는 객체에 도달 할 때까지 모든 것을 적절하게 풀 것입니다.

누군가에게 도움이되기를 바랍니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.