具有外观轮廓的垫形字段效果不佳

时间:2019-11-23 12:08:14

标签: angular typescript angular-material angular8 mat-form-field

我将身体方向更改为rtl。 dir =“ rtl”

和外观为“轮廓”的垫形字段效果不佳。

您可以在https://material.angular.io网站的“表单字段示例”中的“表单字段外观变体”部分中进行尝试,并在堆栈上进行编辑,并将主体方向更改为RTL。

您会看到哪些功能无法正常运行

example

更新:

此问题来自角材料 并立即修复

2 个答案:

答案 0 :(得分:1)

我对Dari(波斯语)语言也有同样的问题,这也是RTL。我可以找到的解决方案是将材料的版本和与角度相关的软件包设置为完全匹配,即从package.json中的软件包的版本中删除^~前缀。

我的package.json如下:

"dependencies": {
    "@angular-devkit/core": "8.0.6",
    "@angular/animations": "8.0.3",
    "@angular/cdk": "8.1.1",
    "@angular/common": "8.2.14",
    "@angular/compiler": "8.2.14",
    "@angular/core": "8.2.14",
    "@angular/flex-layout": "8.0.0-beta.26",
    "@angular/forms": "8.2.14",
    "@angular/http": "7.2.7",
    "@angular/material": "8.0.1",
    "@angular/material-moment-adapter": "5.0.0-rc.1",
    "@angular/platform-browser": "8.2.14",
    "@angular/platform-browser-dynamic": "8.2.14",
    "@angular/router": "8.2.14"
}

一旦编辑了package.json,请删除 package-lock.json node_modules 并执行npm i

答案 1 :(得分:1)

app.module

import { BidiModule } from '@angular/cdk/bidi';

imports: [...
        BidiModule
    ...]

您的组件

<mat-form-field dir="rtl" appearance="outline">...</mat-form-field>