为什么不传递参数解析为角度?

时间:2018-08-29 06:10:17

标签: javascript angular

我试图在单击按钮时在解析器中传递参数,但出现错误 错误

ERROR
Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'next'
Error: Cannot match any routes. URL Segment: 'next'
at ApplyRedirects.noMatchError (https://angular-sxurk5.stackblitz.io/turbo_modules/@angular/router@6.0.0/bundles/router.umd.js:1422:16)
at CatchSubsc

像这样传递参数

 sclick(e){
    e.preventDefault();
    console.log(this.sfrm.value.name);

    this.router.navigate(['next/'],{ queryParams: { value: this.sfrm.value.name} });

    }

使用这样的参数

@Injectable()
export class TestResolver implements Resolve<Observable<string>> {
  constructor(private testService: TestService) {}

  resolve(route: ActivatedRouteSnapshot): Observable<any> {
    // id = 1

    return this.testService.getConfiguration(route.params.value);
  }
}

整个代码

https://stackblitz.com/edit/angular-sxurk5?file=src%2Fapp%2Fhello.component.ts

当我点击submit按钮时,上面的错误显示了为什么?

1 个答案:

答案 0 :(得分:1)

您必须配置next路由,而不仅仅是next/:value路由。

const routes: Routes = [
  { path: 'home', component: HelloComponent },
  { path: 'next', component: NextComponent, resolve: { data: TestResolver} },
  { path: '', redirectTo: '/home', pathMatch: 'full'}
];

TestResolver.ts 中,使用queryParams代替params

resolve(route: ActivatedRouteSnapshot): Observable<any> {
  console.log('dd',route.queryParams.value)
  return this.testService.getConfiguration(route.queryParams.value);
}