如何将我的路线绑定到angular-material2中的步进器？

Question

我正在使用angular-material2的Stepper component，我希望这些步骤能够反映在我的应用程序的URL路由中，以便用户可以共享URL链接并立即获得正确的步。可能吗？

Answer 1

您需要从'@angular/common'注入并使用位置服务：

1）更改位置服务的URL调用go功能。示例：

if (this.stepper.selected.label === 'subscriber') { 
    this.location.go('./enrollment/subscriberInfo');
}

2）更改URL更改后的步进器定位服务的用户功能。示例：

this.location.subscribe( () => {
    if (this.location.isCurrentPathEqualTo('/enrollment/subscriberInfo')) {
        this.stepper.selectedIndex = 0;
    }
    if (this.location.isCurrentPathEqualTo('/enrollment/payment')) {
        this.stepper.selectedIndex = 1;
    } 
    if (this.location.isCurrentPathEqualTo('/enrollment/agreement')) {
        this.stepper.selectedIndex = 2;
    }
});`

仅供参考，我使用步进器的@Output() animationDone: EventEmitter<void>来更改网址。