Angular Material(Angular 4+を使用)に関して質問があります。コンポーネントテンプレートでコンポーネントを追加する<mat-horizontal-stepper>
と、各ステップ内<mat-step>
にコンポーネントをナビゲートするためのステッパーボタンがあります。そのようです...
<mat-horizontal-stepper>
<mat-step>
Step 1
<button mat-button matStepperPrevious type="button">Back</button>
<button mat-button matStepperNext type="button">Next</button>
</mat-step>
<mat-step>
Step 2
<button mat-button matStepperPrevious type="button">Back</button>
<button mat-button matStepperNext type="button">Next</button>
</mat-step>
<mat-step>
Step 3
<button mat-button matStepperPrevious type="button">Back</button>
<button mat-button matStepperNext type="button">Next</button>
</mat-step>
</mat-horizontal-stepper>
今、各ステップからボタンを削除<mat-horizontal-stepper>
して、静的な位置またはの外側のどこかにボタンを配置することが可能かどうか疑問に思ってい<mat-horizontal-stepper>
ます。コンポーネントのタイプスクリプトファイル内のコードを使用して前後に移動できます。アイデアを出すために、HTMLを次のようにしたいと思います
<mat-horizontal-stepper>
<mat-step>
Step 1
</mat-step>
<mat-step>
Step 2
</mat-step>
<mat-step>
Step 3
</mat-step>
<!-- one option -->
<div>
<button mat-button matStepperPrevious type="button">Back</button>
<button mat-button matStepperNext type="button">Next</button>
</div>
</mat-horizontal-stepper>
<!-- second option -->
<div>
<button (click)="goBack()" type="button">Back</button>
<button (click)="goForward()" type="button">Next</button>
</div>
ViewChild
ステッパーをどのように参照できるかを見ているだけでしたが、あなたは私をそれに打ち負かしました!無効化/有効化機能も追加したという事実が大好きです!いくつかのポイントがあります!