文章/答案/技术大牛

发布

社区首页 >问答首页 >MatSelectModule风格没有准确地工作角度6

问MatSelectModule风格没有准确地工作角度6
EN

Stack Overflow用户

提问于 2018-10-02 14:00:47

回答 1查看 801关注 0票数 1

我对角(6)很陌生。我在我的表单中使用了MatSelectModule。它工作得很好，但是它的风格很奇怪，就像选项放在页面底部的某个地方一样。我用这的方式尝试过，但失败了。帮我找出原因。这里有几行，你需要分析。谢谢。

在XYZ.component.html中

             <mat-form-field>
                <mat-select placeholder="Toppings" formControlName="toppings" multiple>
                  <mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
                </mat-select>
              </mat-form-field>

在XYZ.component.ts中

toppingList: string[] = ['Extra cheese', 'Mushroom', 'Onion', 'Pepperoni', 'Sausage', 'Tomato'];

在app.component.ts中

import { MatInputModule, MatButtonModule, MatSelectModule, MatIconModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    FormsModule,
    ReactiveFormsModule,
    MatInputModule,
    MatButtonModule,
    MatSelectModule,
    MatIconModule,
    BrowserAnimationsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})

angular

angular6

angular-material-6

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-10-02 16:46:12

你在应用程序中包括了预先构建的主题css吗？

根据文档，您可以使用预构建的主题之一或定义自定义主题。

您可以将一个主题文件直接包含到您的应用程序中，从@角/材料/预构建主题开始。

现有的预先建立的主题：

deeppurple-amber.css
indigo-pink.css
pink-bluegrey.css
purple-green.css

如果您使用的是角CLI，那么只需在styles.css文件中包含一行：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

或者，您可以直接引用该文件。这看起来应该是：

<link href="node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/52609981

复制

相似问题

问MatSelectModule风格没有准确地工作角度6
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问MatSelectModule风格没有准确地工作角度6EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问MatSelectModule风格没有准确地工作角度6
EN