angular - 无法在其他 socket 上打开路线

我必须在app.component.ts中，其中一个的名称是name='popup'：

@Component({
    selector: 'app-main',
    template: `<router-outlet></router-outlet>
               <router-outlet name="popup"></router-outlet>`
})

export class AppComponent implements OnInit {

  public construnctor(){ }

  ngOnInit(){ }

}

我的路线定义是：

    export const myappRoute: Routes =[
      {
       path: '',
       component : DataEntryComponent
      },
      {
         path: 'templateModal',
         component: TemplateModalComponent,
         outlet: 'popup'
      }
    ];

export const TemplateRoute: ModuleWithProvider = RouterModule.forChild(myappRoute);

当我尝试使用以下代码打开“templatemodal”路由时：

<button type='submit' [routerLink]="['/' , {outlets: {popup : 'templateModal'}}]" replaceUrl="true"> open </button>

我犯了一个错误，说不能用url段templatemodal匹配任何路由。
我的角度是5
这是stackblitz的试镜：https://stackblitz.com/edit/angular-n2eaje

最佳答案

如果是辅助的（即命名的），请为顶级路由使用非空路径
路由存在于延迟加载的模块中。

<button type='submit' [routerLink]="['home', {outlets:{popup:['templateModal']}}]"> open </button>`

并将template url替换为template，因为您添加的是模板视图而不是url
像，

@Component({
    selector: 'app-main',
    template: `<router-outlet></router-outlet>
               <router-outlet name="popup"></router-outlet>`
})

以下是最新的Stackblitz

关于angular - 无法在其他 socket 上打开路线，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52050336/