角度垫选择未填充

Question

我正在尝试使用matSelect版本7.3.7。 问题在于它不填充（或只是不打开？）。是从数组中填充还是手动添加选项都没有关系。当我单击选择框时，它没有打开。页面中包含值。当我检查html时，在mat-select标记下没有选项。

此处为简化版本：https://stackblitz.com/edit/angular-jrqehn

代码如下：

HTML文件

<mat-form-field *ngIf="pages">
          <mat-label>Välj system</mat-label>
          <mat-select [(value)]="computerGuid">
            <mat-option *ngFor="let page of pages" [value]="page.pageGuid">
              {{page.name}}
            </mat-option>
          </mat-select>
        </mat-form-field>

组件（简体）

pages: PageModel[] = [];

export interface PageModel {
  pageGuid: string;
  name: string;
}

ngOnInit() {
 this.pageService.getPages().subscribe(res => {
  this.pages = res;
  this.spinner.hide();
});
}

模块

import { MatSelectModule } from '@angular/material/select';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { BsDropdownModule } from 'ngx-bootstrap';
import { CookieService } from 'ngx-cookie-service';
import { NgxSmartModalModule } from 'ngx-smart-modal';
import { NgxSpinnerModule } from 'ngx-spinner';

import { LoginRoutingModule } from './login-routing.module';
import { LoginComponent } from './login.component';
import { TagService } from '../../shared';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    LoginRoutingModule,
    BsDropdownModule,
    MatSelectModule,
    BrowserAnimationsModule,
    NgxSpinnerModule,
    NgxSmartModalModule.forChild(),
  ],
  providers: [TagService, CookieService],
  declarations: [LoginComponent]
})
export class LoginModule { }

谢谢！

Answer 1

这是解决方法Forked Stackblitz

问题是因为您错过了在应用程序模块中添加浏览器动画模块和

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

在styles.css / scss中 希望对您有帮助！