knockout.js => Wprowadzenie do komponentów

Uwagi

Komponenty umożliwiają sterowanie / widżety wielokrotnego użytku reprezentowane przez ich własny widok (szablon) i viewmodel. Zostały dodane w Knockout 3.2. Zainspirowany przez WebComponents, Knockout pozwala zdefiniować Komponenty jako Elementy Własne, pozwalając na użycie bardziej zrozumiałych znaczników.

Pasek postępu (Boostrap)

Definicja komponentu

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>'
});

Wykorzystanie HTML

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

Modified text is an extract of the original Stack Overflow Documentation

Licencjonowany na podstawie CC BY-SA 3.0

Nie związany z Stack Overflow

knockout.js
Wprowadzenie do komponentów

Szukaj…

Uwagi

Pasek postępu (Boostrap)