Javascript Canjs路由组件

如何使用canjs完成组件路由？
我有下面的例子

can.Component.extend({
    tag: "router",
    events: {
      "{can.route} id bla": function(route, event, id, bla) {
        console.log("route", id, bla);
      }
    }
  });

如何匹配特定路线？例如第/2页/foo.
路线定义为：

can.route(":page/:id/:bla", {page: "", id: "", bla: ""});

---

在组件中布线的诀窍是不要在组件中布线。相反，用类似

can.route(":page/:id", {page: "content", id: "index"});

作为状态对象传递

can.route

。主要视图如下：

<script id="main" type="text/mustache">
  <app-page page="state.page" page-id="state.id"></app-page>
</script>

使用初始化其子组件的视图：

<script id="page" type="text/mustache">
  {{#if isBlog}}
    <app-blog blog-id="pageId"></app-blog>
  {{/if}}
  {{#if isStatic}}
    <app-static page-id="pageId"></app-static>
  {{/if}}
</script>

{{{#如果是博客}
{{/if}
{{#如果是静态的}
{{/if}

<script id="page" type="text/mustache">
  {{#if isBlog}}
    <app-blog blog-id="pageId"></app-blog>
  {{/if}}
  {{#if isStatic}}
    <app-static page-id="pageId"></app-static>
  {{/if}}
</script>