尝试在 plunker 中创建 aurelia 路由
trying to create aurelia routing in plunker
我正在 plunker
创建一个页面来演示 aurelia routing
。这里是link。由于某种原因,我无法在页面中显示路线。我能够在我的本地环境中 运行 类似的代码就好了。我认为这是 plunker 中必须以不同方式完成的事情。
代码如下:
app.html
<template>
<h1>Hello</h1>
<div class="row col-lg-6 col-lg-offset-3">
<div class="btn-group col-sm-offset-1" role="group" aria-label="...">
<a repeat.for="row of router.navigation" class="${row.isActive ? 'active btn btn-primary' : 'btn btn-default'}" href.bind="row.href">
${row.title}
</a>
</div>
<router-view></router-view>
</div>
</template>
app.ts
import { Aurelia, PLATFORM } from "aurelia-framework";
import { Router, RouterConfiguration } from "aurelia-router";
export class App {
router: Router;
// Configure Routing
configureRouter(config: RouterConfiguration, router: Router): void {
console.log("Aurelia routing");
config.title = "Aurelia Routing";
// config.options.root = "/";
config.map([
{
route: "",
redirect: "home",
settings: { icon: "home" }
},
{
route: "home",
moduleId: "./Home",
nav: true,
title: "Home",
settings: { icon: "home" }
},
{
route: "/support",
moduleId: "./Support",
nav: true,
title: "Support Request",
settings: { icon: "home" }
}
]);
this.router = router;
console.log(router);
}
// console.log(this.router);
}
可以在 plunker link 中找到更多详细信息,例如引导等。
你的 main.ts
中有一个 typo/error:
aurelia.use.basicConfiguration()
应该是:
aurelia.use.standardConfiguration()
更改此设置后,我看到了您在配置中输入的 console.log
消息,但我收到了另一个错误,但路由现在可以正常工作。
我正在 plunker
创建一个页面来演示 aurelia routing
。这里是link。由于某种原因,我无法在页面中显示路线。我能够在我的本地环境中 运行 类似的代码就好了。我认为这是 plunker 中必须以不同方式完成的事情。
代码如下:
app.html
<template>
<h1>Hello</h1>
<div class="row col-lg-6 col-lg-offset-3">
<div class="btn-group col-sm-offset-1" role="group" aria-label="...">
<a repeat.for="row of router.navigation" class="${row.isActive ? 'active btn btn-primary' : 'btn btn-default'}" href.bind="row.href">
${row.title}
</a>
</div>
<router-view></router-view>
</div>
</template>
app.ts
import { Aurelia, PLATFORM } from "aurelia-framework";
import { Router, RouterConfiguration } from "aurelia-router";
export class App {
router: Router;
// Configure Routing
configureRouter(config: RouterConfiguration, router: Router): void {
console.log("Aurelia routing");
config.title = "Aurelia Routing";
// config.options.root = "/";
config.map([
{
route: "",
redirect: "home",
settings: { icon: "home" }
},
{
route: "home",
moduleId: "./Home",
nav: true,
title: "Home",
settings: { icon: "home" }
},
{
route: "/support",
moduleId: "./Support",
nav: true,
title: "Support Request",
settings: { icon: "home" }
}
]);
this.router = router;
console.log(router);
}
// console.log(this.router);
}
可以在 plunker link 中找到更多详细信息,例如引导等。
你的 main.ts
中有一个 typo/error:
aurelia.use.basicConfiguration()
应该是:
aurelia.use.standardConfiguration()
更改此设置后,我看到了您在配置中输入的 console.log
消息,但我收到了另一个错误,但路由现在可以正常工作。