如何为所有焦点源设置相同的md-checkbox焦点轮廓

Question

当使用键盘聚焦md-checkbox时，周围会有轮廓。 但是，当以编程方式设置焦点时，没有可视指示器。有没有办法让它看起来一样？

Answer 1

Ripple是一个点击/焦点事件。如果要在以编程方式设置复选框后获得涟漪效果，则需要从代码中聚焦元素。为此，您还需要为控件添加引用。

在您的模板中，将参考变量添加到您的复选框，例如customCheckbox：

<md-checkbox [(ngModel)]="checked" #customCheckbox>Check me!</md-checkbox>

...在您的代码中，您需要在此控件上调用focus()方法：

// Import MdCheckbox in your ts file
import { MdCheckbox } from '@angular/material';

// Declare customCheckbox in your class
@ViewChild('customCheckbox') private customCheckbox: MdCheckbox;

// Use this line to focus the checkbox programmatically where you want.
this.customCheckbox.focus();

链接到working demo。