Question

我有AngularDart项目的这些简单路线：

// application shell 
@RouteConfig(const [
  const Route(path: '/...', name: 'Home', component: StatusesAreaComponent,useAsDefault: true),
])
class AppComponent { }

// my status area router
@Component(
    selector: 'status-area',
    template: '<router-outlet></router-outlet>',
    directives: const [ROUTER_DIRECTIVES])
@RouteConfig(const [
  const Route(
      path: '/...',
      name: 'StatusArea',
      component: StatusesWrapperComponent,
      useAsDefault: true)
])
class StatusesAreaComponent {}

// status-wrapper component
@Component(
  selector: 'statuses-wrapper',
  template: '<router-outlet></router-outlet>',
  directives: const [CORE_DIRECTIVES,ROUTER_DIRECTIVES],
)
@RouteConfig(const [
  const Route(path: '/status/:id', name: 'StatusItem', component: StatusItemComponent),
  const Route(path: '/', name: 'StatusHome', component: StatusListComponent, useAsDefault: true),
])
class StatusesWrapperComponent  { }

StatusListComponent适用于此网址：#/就好了;但在StatusItemComponent组件中，RouteParams canot会找到:id参数。 StatusItemComponent的代码如下：

@Component(
    selector: 'status-item',
    templateUrl: 'status_item_component.html',
    directives: const [CORE_DIRECTIVES, ROUTER_DIRECTIVES])
class StatusItemComponent implements OnInit {
  final StatusService _statusService;
  final RouteParams _routeParams;
  final Location _location;

  Status status;

  StatusItemComponent(this._statusService, this._routeParams, this._location);

  @override
  Future<Null> ngOnInit() async {
    print('in ngOnInit in StatusItemComponent');
    print(_routeParams);
    var _id = _routeParams.get('id'); // I'll get error here
    print('_id = ' + _id);
    var id = int.parse(_id ?? '', onError: (_) => null);
    if (id != null) status = await _statusService.get(id);
  }
}

在这一行：var _id = _routeParams.get('id');我收到此异常（来自Chrome中的javascript控制台）：

in ngOnInit in StatusItemComponent -- this is log --
Instance of 'RouteParams' -- this is log --
EXCEPTION: Invalid argument: 1
STACKTRACE: 
Invalid argument: 1
    at Object.wrapException (http://localhost:49433/main.dart.js:4073:17)
    at Interceptor.$add (http://localhost:49433/main.dart.js:1397:19)
    at http://localhost:49433/main.dart.js:21513:44
    at _wrapJsFunctionForAsync_closure.$protected (http://localhost:49433/main.dart.js:6686:15)
    at _wrapJsFunctionForAsync_closure.dart._wrapJsFunctionForAsync_closure.call$2 (http://localhost:49433/main.dart.js:7181:14)
    at _awaitOnObject_closure.dart._awaitOnObject_closure.call$1 (http://localhost:49433/main.dart.js:7169:34)
    at StaticClosure.dart._rootRunUnary (http://localhost:49433/main.dart.js:7025:18)
    at _ZoneDelegate.runUnary$3 (http://localhost:49433/main.dart.js:9984:41)
    at NgZone.dart.NgZone._runUnary$5 (http://localhost:49433/main.dart.js:26490:24)
    at Object.eval (eval at Closure_forwardCallTo (http://localhost:49433/main.dart.js:4393:14), <anonymous>:2:47)
ORIGINAL EXCEPTION: Invalid argument: 1

我对Angular和Dart都很陌生，并且不知道问题可能是什么。你能帮忙找到问题吗？提前致谢。

更新

请求的网址为#/status/1。另外，我更改了行print(_routeParams); print(_routeParams.params);，而id存在于params;它打印：

{id: 1}

另外，我应该提一下我刷新页面的位置，它有效！但不是第一次加载。

在子组件中找不到route-parameter

0 个答案: