Question

I am implementing MatDatePicker but I have this visual issue with this component:

我的图书馆代码: 我的法典。

https://github.com/Crisfon6/ngx-components-lib-cf6/tree/main/projects/ngx-components-lib-cf6 执行:

( https://github.com/Crisfon6/ngx-components-lib-cf6/tree/main/projects/ngx-components-lib-cf6)

这也是单体材料页的同样例子。

@Component({
  selector:  lib-mat-datepicker ,
  standalone: true,
  imports: [
    MatFormFieldModule, MatDatepickerModule, FormsModule, ReactiveFormsModule, JsonPipe
  ],
  providers: [provideNativeDateAdapter(),provideAnimations()],
  template: `
<mat-form-field>
  <mat-label>Enter a date range</mat-label>
  <mat-date-range-input [formGroup]="range" [rangePicker]="picker">
    <input matStartDate formControlName="start" placeholder="Start date">
    <input matEndDate formControlName="end" placeholder="End date">
  </mat-date-range-input>
  <mat-hint>MM/DD/YYYY – MM/DD/YYYY</mat-hint>
  <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-date-range-picker #picker></mat-date-range-picker>

  @if (range.controls.start.hasError( matStartDateInvalid )) {
    <mat-error>Invalid start date</mat-error>
  }
  @if (range.controls.end.hasError( matEndDateInvalid )) {
    <mat-error>Invalid end date</mat-error>
  }
</mat-form-field>

<p>Selected range: {{range.value | json}}</p>
  `,
  styleUrl:  ./matDatepicker.component.css 
})
export class MatDatepickerComponent {
  range = new FormGroup({
    start: new FormControl<Date | null>(null),
    end: new FormControl<Date | null>(null),
  });
 }

Answer 1

你们需要把黄色材料作为主题。 json

   "styles": [
          "@angular/material/prebuilt-themes/indigo-pink.css",
          "src/styles.css"
        ],

我正在试验一个把“我们所看的时代”的“我们/人/人/人”。

友情链接