knockout.js
Komponenten Einführung

AngularJS ASP.NET asp.net-mvc C# Language CSS HTML JavaScript jQuery twitter-bootstrap TypeScript
Suche…


Bemerkungen

Komponenten ermöglichen wiederverwendbare Steuerelemente / Widgets, die durch ihre eigene Ansicht (Vorlage) und ihr eigenes Ansichtsmodell dargestellt werden. Sie wurden in Knockout 3.2 hinzugefügt. Inspiriert von WebComponents ermöglicht Knockout die Definition von Komponenten als benutzerdefinierte Elemente, wodurch die Verwendung selbsterklärender Markierungen ermöglicht wird.

Fortschrittsbalken (Boostrap)

Komponentendefinition 

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-Nutzung 

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


Modified text is an extract of the original Stack Overflow Documentation
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow