Al fin después de tanto batallar pudimos dar con el resultado de este atasco que tantos usuarios de nuestro espacio tienen. Si deseas aportar algún detalle puedes dejar tu información.
Solución:
Así que me las arreglé con esta solución alternativa:
https://github.com/angular/material2/issues/7700#issuecomment-336138411
1) Hacer una referencia al paso a paso:
2) Luego, en el lado .ts:
import ViewChild from '@angular/core';
import MatVerticalStepper from '@angular/material';
@ViewChild('stepper') stepper: MatVerticalStepper;
clearAdditionalForms(): void
this.inventoryForms = [];
this.stepper._stateChanged(); // <- this : Marks the component to be change detected.
Esto es llamar a un método privado, lo que probablemente sea una muy mala idea, así que si tiene una solución mejor/correcta, hágamelo saber y cambiaré la respuesta.
Una forma un poco más angular, evitando el método privado, es registrar lo que necesita hacer en el control de formulario utilizado por el paso. Entonces, por ejemplo, digamos que tenemos un paso:
Luego defina su grupo de formularios:
this.secondFormGroup = this._formBuilder.group(
check: [false, Validators.requiredTrue]
);
Ahora hemos definido un pseudo elemento "verificar", que será validado por el paso. Digamos que configuramos algo con una función de clic:
doClick(item)
this.secondFormGroup.controls.check.setValue(item === 'thevalue');
El material angular ahora hará el resto, no podrá pasar del paso hasta que el elemento === el valor.
Agrega *ngIf en cada paso
Puntuaciones y comentarios
Si sostienes alguna desconfianza o disposición de progresar nuestro crónica te proponemos ejecutar una apostilla y con placer lo observaremos.