knockout.js => 부품 소개

비고

구성 요소는 자체 뷰 (템플릿) 및 뷰 모델로 표현 된 재사용 가능한 컨트롤 / 위젯을 허용합니다. 그들은 녹아웃 3.2에서 추가되었다. WebComponents에서 영감을 얻은 Knockout을 사용하면 구성 요소를 사용자 정의 요소로 정의 할 수 있기 때문에보다 자명 한 마크 업을 사용할 수 있습니다.

진행 표시 줄 (Boostrap)

구성 요소 정의

ko.components.register('progress-bar', {
    viewModel: function(params) {
            var that = this;
    
        // progress is a numeric value between 0 and 100
        that.progress = params.progress;
        
        
        that.progressPercentual = ko.computed(function(){
            return '' + ko.utils.unwrapObservable(that.progress) + '%';
        })
    },
    template:
        '<div class="progress"> <div data-bind="attr:{\'aria-valuenow\':progress}, style:{width:progressPercentual}, text:progressPercentual" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;"></div> </div>'
});

HTML 사용

<progress-bar params="progress:5"></progress-bar>

Modified text is an extract of the original Stack Overflow Documentation

아래 라이선스 CC BY-SA 3.0

와 제휴하지 않음 Stack Overflow

knockout.js
부품 소개

수색…

비고

진행 표시 줄 (Boostrap)