/
githubmirror
/
components
Обзор
Документация
Войти
/
githubmirror
/
components
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
src/components-examples/material/stepper/stepper-responsive/stepper-responsive-example.ts
50 строк
2 KB
Kristiyan Kostadinov
docs: remove standalone flag from examples
17 окт 2024, 17:40
17 окт 2024, 17:40
36f4cca
Код
Авторство
О чём код?
import {Component, inject} from '@angular/core'; import {FormBuilder, Validators, FormsModule, ReactiveFormsModule} from '@angular/forms'; import {BreakpointObserver} from '@angular/cdk/layout'; import {StepperOrientation, MatStepperModule} from '@angular/material/stepper'; import {Observable} from 'rxjs'; import {map} from 'rxjs/operators'; import {MatButtonModule} from '@angular/material/button'; import {MatInputModule} from '@angular/material/input'; import {MatFormFieldModule} from '@angular/material/form-field'; import {AsyncPipe} from '@angular/common'; /** * @title Stepper responsive */ @Component({ selector: 'stepper-responsive-example', templateUrl: 'stepper-responsive-example.html', styleUrl: 'stepper-responsive-example.css', imports: [ MatStepperModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule, AsyncPipe, ], }) export class StepperResponsiveExample { private _formBuilder = inject(FormBuilder); firstFormGroup = this._formBuilder.group({ firstCtrl: ['', Validators.required], }); secondFormGroup = this._formBuilder.group({ secondCtrl: ['', Validators.required], }); thirdFormGroup = this._formBuilder.group({ thirdCtrl: ['', Validators.required], }); stepperOrientation: Observable<StepperOrientation>; constructor() { const breakpointObserver = inject(BreakpointObserver); this.stepperOrientation = breakpointObserver .observe('(min-width: 800px)') .pipe(map(({matches}) => (matches ? 'horizontal' : 'vertical'))); } }