您好,我目前正在研究Mat-Stepper。好吧,其中两个。你看我有这个组件,它拥有两个这样的ng-templates:
将问题推到顶部:为什么我选择的索引不起作用是我想念的东西。我知道您可以在步进器上定义TypeError: unsupported operand type(s) for -: 'QuerySet' and 'QuerySet'
,但我认为我认为它可以正常工作。感谢帮助
[selectedIndex]="condition"
verticalStepper:
<div *ngIf="!isSmallScreen; then horizontalStepper else verticalStepper"></div>
水平步进器:
<ng-template #verticalStepper>
<mat-vertical-stepper [linear]="isLinear"
style="z-index: 1; display: inline;"
class="container-fluid width-limit">
<mat-step [completed]="condition1"></matstep>
<mat-step [completed]="condition2"></matstep>
</mat-vertical-stepper>
</ng-template>
这是我父母应该处理的选定索引的功能
<ng-template #horizontallStepper>
<mat-horizontal-stepper [linear]="isLinear"
style="z-index: 1; display: inline;"
class="container-fluid width-limit">
<mat-step [completed]="condition1"></matstep>
<mat-step [completed]="condition2"></matstep>
</mat-vertical-stepper>
</ng-template>
此函数应设置索引但不起作用
ngAfterViewInit() {
if (!conition1) {
this.move(0);
} else if (condition1) {
this.move(1);
} else if (condition2) {
this.move(2);
}
}
对于变量smallscreen:
move(index: number) {
if (this.isSmallScreen) {
this.verticalStepper.selectedIndex = index;
} else {
this.horizontalStepper.selectedIndex = index;
}
}
这些是我的视线孩子
@HostListener('window:resize', ['$event'])
onResize(event) {
if (event.target.innerWidth >= 600) {
this.isSmallScreen = false;
} else {
this.isSmallScreen = true;
}
}