Question

我已经定义了两条路线。

/苹果---＆GT; AppleComponent，

/ apples /：id ---＆gt; AppleDetailComponent，

当我访问/ apples / 111时，它将首先进入AppleComponent，然后进入AppleDetailComponent。

我应该怎么办，当访问/ apples /：id？

时，它将匹配/ apples /：id

我hava也试过{pathMatch：'full'}但它不起作用。

角度教程使用两种不同的路线：

/英雄

/细节/：heroId

它必须使用不同的前缀??

===更新======= @ im.pankratov我的路线与你的路线完全相同。

最后我发现问题是 apple is null 。

export class AppleDetailComponent implements OnInit {
constructor(
 private appleService:AppleService,
 private route:ActivatedRoute,
 private location:Location
) {
}

@Input() apple: Apple;

ngOnInit() {
 this.route.params.switchMap((params:Params) => this.appleService.getApple(params['id']))
 .subscribe(apple => {
 this.apple = apple
 });
}

如果我添加* ngIf ='apple'，则错误将消失。

<div class="container" *ngIf='apple'>
    <h1>{{apple.title}} {{apple.desc}}</h1>
</div>

ngOnInit完成后html如何渲染？

Answer 1

您需要正确定义路线。例如，这是单独模块的路由配置如下所示：

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    yourCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:@"yourCustomCell"];
    if (cell == nil) {
        // Load the top-level objects from the custom cell XIB.
        NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:@"yourCustomCell" owner:self options:nil];
        // Grab a pointer to the first object (presumably the custom cell, as that's all the XIB should contain).
        cell = [topLevelObjects objectAtIndex:0];
    }

    return cell;
}

这里最重要的是import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { AppleComponent } from './path/to/apple.component'; import { AppleDetailComponent } from './path/to/apple-detail.component'; const routes: Routes = [ { path: 'apples', children: [ { path: '', component: AppleComponent }, { path: ':id', component: AppleDetailComponent}, ] }, ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule], providers: [] }) export class AppleRoutingModule { }常数。

角度路线必须使用不同的前缀？

1 个答案: