在Angular 2中,可以使用以下解决方法来实现元素下划线的效果:
.element-class::after {
content: "";
display: block;
border-bottom: 1px solid black;
}
然后,在对应的组件模板中,将该样式类应用于需要添加下划线的元素:
这是一个带下划线的元素
ng generate directive underline
然后,在指令的代码中添加下划线样式:
import { Directive, ElementRef } from '@angular/core';
@Directive({
selector: '[appUnderline]'
})
export class UnderlineDirective {
constructor(private elementRef: ElementRef) {
this.elementRef.nativeElement.style.borderBottom = '1px solid black';
}
}
最后,在需要应用下划线的元素上使用指令:
这是一个带下划线的元素
以上是两种在Angular 2中实现元素下划线的解决方法。你可以根据自己的需求选择适合的方法。