Question

我正在尝试使AngularDart路由正常工作，这让我头疼。我正在尝试获取子路由的查询参数，并且在扩展the tutorial here says之类的OnActivate时，它在我的组件中不起作用。它可以识别页面，但不会在RouterState中给我参数。我不知道为什么我没有错误，也没有警告或其他任何信息。我现在可以使用Uri类绕过它来测试其他事情并保持动力，但是我希望它按预期运行。

这是结构：

Top
 - /routes.dart
 - /route_paths.dart
 - /resources_list_component.dart
 - /resources
   - ./resources_routes.dart
   - ./resources_route_paths.dart
   - ./my_resource_component.dart
   - ./my_resource_component.html

在/route_paths.dart中，我有

static final resources = RoutePath(path: 'resources');

然后在/routes.dart中使用哪个：

static final resources = RouteDefinition(
  routePath: RoutePaths.resouces
  component: resource_list_template.ResourceListComponentNgFactory
);

然后我将此路径用作资源路由路径文件中的父路由器：

static final resource = RoutePath(
  path: 'resource/:id',
  parent: _parent.RoutePaths.resources
);

在上面的代码片段中，您可以看到我期望RouterState具有AngularDart文档中建议的查询参数id。这使我可以执行以下操作：http://localhost/#/resources/resource/1

然后在resources/resources_routes.dart中使用此路由器路径：

    static final resource = RouteDefinition(
        routePath: ResourcesRoutePaths.resource,
        component: my_resource_template.MyResourceComponentNgFactory,
    );

    static final all = <RouterDefinition>[ resource ];

所有这些几乎都有效。当我转到网址/resources/resource/1时，的确确实看到了my_resource_component.html的正确HTML输出，因此我知道Angular Routing可以正常工作了。更重要的是试图使/1成为名称为“ id”的查询参数。

在文档中说我需要使用OnActivate扩展该组件，该组件特定于应用程序的生命周期。因此，我将以下方法添加到控制器中：

@Component(...)
class MyResourceComponent extends OnActivate {
    ...
    @override
    OnActivate (RouterState _, RouterState current) {
       Console().log(current.queryParameters.isEmpty);
    }
}

以上代码输出true。如在queryParameters中为空。我已按照指南进行操作，目前我不知道自己缺少什么。有人知道为什么会发生这种情况，还是我错过了一个醒目的步骤？

Answer 1

问题是您尝试访问event.x而不是queryParameters。

parameters

vs

Console().log(current.queryParameters.isEmpty);

https://angulardart.dev/api/angular_router/angular_router/RouterState/parameters

Console().log(current.parameters.isEmpty);映射返回URL参数，而parameters映射返回查询参数。例如，给定网址：

queryParameters

“ 1”是url参数，其中“ hey”是查询参数。

Dart角路径参数不起作用

1 个答案: