[英]How to override Aurelia ViewModel resolution?
The Aurelia framework has a strong appeal to convention-over-configuration. Aurelia框架对基于约定的约定具有强烈的吸引力。
In its docs sample app (typescript) , we've got a source code structure like this: 在其docs 示例应用程序(类型脚本)中 ,我们具有如下的源代码结构:
.
├── index.html
├── config.js
├── src
├── main.ts
├── app.ts // viewmodel
├── app.html // view
├── welcome.ts // viewmodel
├── welcome.html // view
├── users.ts // viewmodel
├── users.html // view
(...)
For organization purposes, I would rather organize the sources with each view/viewmodel/private components/etc in their own folder, obtaining a folder structure like this: 出于组织目的,我宁愿将每个view / viewmodel / private组件/ etc的源组织在其自己的文件夹中,从而获得如下所示的文件夹结构:
.
├── index.html
├── config.js
├── src
├── main.ts
├── app
├── app.ts // viewmodel
├── app.html // view
├── welcome
├── welcome.ts // viewmodel
├── welcome.html // view
├── users
├── users.ts // viewmodel
├── user-info.ts // view-specific component (1)
├── user-detail.ts // view-specific component (2)
├── users.html // view
(...)
Is there a way to do this implementing a custom resolver or overriding the convention? 有没有办法实现自定义解析器或重写约定? That is, I want to avoid explicit path boilerplate code in my Router config. 也就是说,我想在路由器配置中避免显式的路径模板代码。 Any suggestions? 有什么建议么?
There's a workaround. 有一种解决方法。
I see that you don't want to type the specific path all the time, like: welcome/welcome
. 我看到您不想一直输入特定的路径,例如: welcome/welcome
。 So, you can put the routes array in a variable, and then replace all moduleIds, according to your pattern. 因此,您可以根据自己的模式将routes数组放入一个变量中,然后替换所有moduleIds。 Like this: 像这样:
let routes = [
{ route: ['', 'welcome'], name: 'welcome', moduleId: 'welcome', nav: true, title: 'Welcome' },
{ route: 'test', name: 'test', moduleId: 'test', nav: true, title: 'Test' },
];
updateRoutes(routes);
config.map(routes);
Update routes function: 更新路线功能:
function updateRoutes(routes) {
for (i = 0; i < routes.length; i++) {
let route = routes[i];
if (route.moduleId.indexOf('/') === -1) {
route.moduleId = `${route.moduleId}/${route.moduleId}`;
routes[i] = route;
}
}
}
So, welcome
becomes welcome/welcome
. 因此, welcome
变成welcome/welcome
。 Be aware that the function will only replace the moduleId if there's no '/' in its value; 请注意,该函数仅在其值中没有'/'时才替换moduleId;
Using this way, you aren't "hurting" the framework, as explained in the @JeremyDanyow's comment. 使用这种方式,您不会像@JeremyDanyow的注释中所述“破坏”框架。
In main.js
, .setRoot()
becomes .setRoot('app/app')
. 在main.js
, .setRoot()
变为.setRoot('app/app')
。 This is required because setRoot
with no args assumes an app.js
at the root of your project. 这是必需的,因为setRoot
与无参数假定一个app.js
在你的项目的根目录。
Route configuration changes are limited to the moduleId
... This: 路由配置更改仅限于moduleId
...这:
config.map([
{ route: ['', 'welcome'], name: 'welcome', moduleId: 'welcome', nav: true, title: 'Welcome' },
{ route: 'users', name: 'users', moduleId: 'users', nav: true, title: 'Github Users' },
]);
Becomes this: 变成这个:
config.map([
{ route: ['', 'welcome'], name: 'welcome', moduleId: 'welcome/welcome', nav: true, title: 'Welcome' },
{ route: 'users', name: 'users', moduleId: 'users/users', nav: true, title: 'Github Users' },
]);
Not sure if this answers your question. 不知道这是否能回答您的问题。 Are you looking for a way for the router to convert the moduleId from 'welcome'
to 'welcome/welcome'
? 您是否正在寻找路由器将moduleId从'welcome'
转换为'welcome/welcome'
?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.