我有一个这样的指令叫做省略号。我这样用它:
<p class="card-text" ellipsis>{{ description }}</p>
这是指令:
@Directive({
selector: '[ellipsis]'
})
export class EllipsisDirective implements OnInit, AfterContentInit {
constructor(private el: ElementRef,private renderer: Renderer2) {
console.log(el);
}
truncateText() {
let el = this.el.nativeElement;
var wordArray = el.innerHTML.split(' ');
while(el.scrollHeight > el.offsetHeight) {
wordArray.pop();
el.innerHTML = wordArray.join(' ') + '...';
}
}
ngOnInit(): void {
}
ngAfterContentInit(): void {
this.truncateText();
}
}
问题是innerHTML
为空。但原来的{{ description }}
不是。我做错了什么?
答案 0 :(得分:0)
这不是很直观,但ngAfterViewChecked
似乎有效。我尝试了所有的活动。
ngAfterViewChecked() {
this.truncateText();
}