ฉันมีคำถามเกี่ยวกับ 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>
และฉันสามารถนำทางไปข้างหลังและข้างหน้าโดยใช้โค้ดภายในไฟล์ typescript ของคอมโพเนนต์ของฉัน เพื่อให้ความคิดฉันต้องการให้ 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
และดูว่าฉันจะอ้างอิง Stepper ได้อย่างไร - แต่คุณเอาชนะฉันไปแล้ว! ชอบความจริงที่คุณเพิ่มฟังก์ชันปิด / เปิดใช้งานด้วย! มีบางจุด!