垫选择下拉位置未对齐 [英] mat-select dropdown position not aligned
本文介绍了垫选择下拉位置未对齐的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用一些角形材料组件,但输入框和select选项元素出了点问题.选择选项未正确对齐.当我单击查看选择选项列表时,它显示我当前的div之外,或者可以说页面的左侧不正确.
I'm using some angular material components but something went wrong with input box and and select option elements. The select option is not aligned properly. when i click to see select option list it showing me outside of my current div or can say left side of page which is not correct.
ng -v
Angular CLI: 1.7.4
Node: 8.11.1
OS: win32 x64
Angular: 5.2.11
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
@angular/cdk: 5.2.5
@angular/cli: 1.7.4
@angular/material: 5.2.5
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.2
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.5.3
webpack: 3.11.0
附件中的图像是这样的:
Image is attached how it looks like:
推荐答案
请确保已在应用模块中导入BrowserAnimationsModule并将Hammerjs导入到主ts文件中.这是角材料
Plase make sure you have imported BrowserAnimationsModule in your app module and hammerjs in to the main ts file. Here is the guide line for angular material
我的应用模块代码:
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatTooltipModule, MatButtonModule, MatCheckboxModule, MatSelectModule } from
'@angular/material';
@NgModule({
imports: [
MatTooltipModule,
MatButtonModule,
MatCheckboxModule,
MatSelectModule,
BrowserAnimationsModule,
BrowserModule
],
providers: [],
bootstrap: []
})
export class AppModule { }
主要交易代码:
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import 'hammerjs';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));
这篇关于垫选择下拉位置未对齐的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文