Skip to content

sharmad-nachnolkar/ko-component-router

 
 

Repository files navigation

ko-component-router

NPM Version WTFPL Travis Coverage Status Dependency Status Peer Dependency Status NPM Downloads

Component-based router for developing wicked awesome single-page apps with KnockoutJS.

Supports nested routing, read/write querystring param observables, read/write state observables

DOCS

app.js
'use strict'

require('ko-component-router')

ko.components.register('app', {
  viewModel: class App {
    constructor() {
      this.routes = {
        '/': 'home',
        '/user/:id': 'user'
      }
    }
  },
  template: `
    <ko-component-router params="
      routes: routes,
      hashbang: false">
    </ko-component-router>
  `
})

ko.component.register('home', {
  template: `<a href="/users/1234">Show user</a>`
})

ko.components.register('user', {
  viewModel: class User {
    constructor(ctx) {
      // ctx.params
      // ctx.query
      // ctx.hash
      //
      // ...and more!
    }
  },
  template: '<!-- ctx is also available as $router in the binding context -->'
})

ko.applyBindings()
index.html
<body>
  <app></app>
</body>

Requires babel-polyfill for IE support

About

🚉 Component-based router for developing wicked awesome apps with Knockout

Resources

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages

  • JavaScript 53.1%
  • CSS 46.8%
  • HTML 0.1%