使用变量作为 属性 名称（例如在 angular 路由器中）

Question

是否可以在 angular 路由器中使用字符串变量作为插座名称？ 我想使用这样的东西：

const outletName = 'myrouteroutlet';
this.router.navigate([
      { outlets: { myrouteroutlet: ['pathname'] } },
    ]);

但是该变量不会被解释为变量，而是被解释为 属性 名称，因此路由器会尝试查找名为 outletName 而不是 myrouteroutlet 的插座。

Answer 1

要使用变量的 value 而不是变量的 name 作为键，将键包装在 [ ].所以，这将是：

const outletName = 'myrouteroutlet';
this.router.navigate([
    { outlets: { [outletName]: ['pathname'] } },
]);

这与：{ outlets: { myrouteroutlet: ['pathname'] } } 相同。这不仅适用于路线，而且适用于很多地方。