How to use knockout - 10 common examples

constructor(
        private readonly eventManager: EventManager,
        private readonly mediaService: IMediaService,
        private readonly viewManager: ViewManager,
        private readonly widgetService: IWidgetService
    ) {
        // setting up...
        this.mediaItems = ko.observableArray();
        this.selectedMedia = ko.observable();
        this.searchPattern = ko.observable();
        this.working = ko.observable(true);
    }

constructor(graph) {
    this.selected = ko.computed({
      read() {
        return graph.currentActionContext() == this;
      },
      write(val) {
        // val is this if we're called from a click ko binding
        if (val === this || val === true) {
          graph.currentActionContext(this);
        } else if (graph.currentActionContext() == this) {
          graph.currentActionContext(null);
        }
      },
      owner: this
    });
  }
}

constructor(
        private readonly blockService: IBlockService,
        private readonly sectionModelBinder: SectionModelBinder,
        private readonly viewManager: IViewManager
    ) {
        this.addBlock = this.addBlock.bind(this);

        this.working = ko.observable(false);
        this.name = ko.observable();
        this.name.extend({ required: true });
    }

constructor(
        private readonly usersService: UsersService, 
        private readonly tenantService: TenantService,
        private readonly backendService: BackendService,
        private readonly router: Router) {
        this.user = ko.observable();
        this.firstName = ko.observable();
        this.lastName = ko.observable();
        this.email = ko.observable();
        this.password = ko.observable();
        this.confirmPassword = ko.observable();
        this.isEdit = ko.observable(false);
        this.isBasicAccount = ko.observable(false);
        this.working = ko.observable(false);
        this.registrationDate = ko.computed(() => this.getRegistrationDate());
    }

constructor(private readonly usersService: UsersService) {
        this.username = ko.observable("");
        this.password = ko.observable("");
        this.errorMessages = ko.observableArray([]);
        this.hasErrors = ko.observable(false);
        this.working = ko.observable(false);
        this.canSubmit = ko.pureComputed(() => {
            return !!this.username() && !!this.password() && !this.working();
        });
    }

constructor(
        private readonly apiService: ApiService,
        private readonly routeHelper: RouteHelper,
        private readonly router: Router,
    ) {
        this.changeLogPageUrl = ko.observable();
        this.api = ko.observable();
        this.selectedApiName = ko.observable();
        this.versionApis = ko.observableArray([]);
        this.working = ko.observable(false);
        this.currentApiVersion = ko.observable();
        this.downloadSelected = ko.observable("");
        this.loadApi = this.loadApi.bind(this);
    }

constructor(
        private readonly apiService: ApiService,
        private readonly routeHelper: RouteHelper
    ) {
        this.detailsPageUrl = ko.observable();
        this.allowSelection = ko.observable(false);
        this.apis = ko.observableArray([]);
        this.working = ko.observable();
        this.pattern = ko.observable();
        this.page = ko.observable(1);
        this.hasPrevPage = ko.observable();
        this.hasNextPage = ko.observable();
        this.hasPager = ko.computed(() => this.hasPrevPage() || this.hasNextPage());
        this.apiGroups = ko.observableArray();
        this.groupByTag = ko.observable(false);
    }

private applyBinding() {
    if (!this.renderedElement) return;
    this.updateKoCurrentPage();
    ko.cleanNode(this.renderedElement);
    if (!this.isFirstRender) {
      this.updateCurrentPageQuestions();
    }
    this.isFirstRender = false;
    ko.applyBindings(this, this.renderedElement);
  }
  private updateKoCurrentPage() {

BuildDetailView.init = function (instance, domobj) {
    var view = new BuildDetailView(instance);
    var domobj = domobj || $('#build-detail')[0];
    ko.applyBindings(view, domobj);
    return view;
};

GoldView.init = function (config, obj) {
    var view = new GoldView(config);
    var obj = obj || $('#payment-form')[0];
    ko.applyBindings(view, obj);
    return view;
}