Question

我使用角度4并使用Angular材质 https://material.angular.io/components/autocomplete/api 我想在我的md-autocomplete中添加边框半径，但它不起作用......

char[]

你有解释吗？有可能吗？

非常感谢

Answer 1

要更改drowpdown列表样式，请使用.mat-autocomplete-panel classname：

::ng-deep .mat-autocomplete-panel{
  border-radius: 10px;    
}

这将影响所有自动完成。如果您有多个并希望以不同方式设置它们，则可以相应地设置不同的变量名称和样式。例如，对于第二个：

<强> HTML

<md-autocomplete #mauto="mdAutocomplete">

<强> CSS

::ng-deep .mat-autocomplete-panel#md-autocomplete-0{  //for the first one

::ng-deep .mat-autocomplete-panel#md-autocomplete-1{ //for the second one

Answer 2

你想在md-autocomplete周围放一个边框，还是想让边框在md-form-field周围？

我相信你想要它在表格领域。有关HTML的示例，请参阅https://material.angular.io/components/autocomplete/examples。

如果您打开以下plunkr，它会使用您的CSS来设置md-form-field的样式：

.example-full-width {
     background-color: rgb(255, 0, 0);
     border-bottom-left-radius: 50px;
     border-bottom-right-radius: 50px
}

我用的是红色而不是15％的灰色，所以更明显。