2016-11-04 1 views
1

특히 ng2-bootstrap 툴팁에서 {{UpdateTime}}과 {{RawValue}} 사이에 줄 바꿈을 넣으려면 어떻게해야합니까?ng2-bootstrap 특정 위치에서 툴팁 내용 줄 바꿈

HTML :

<span tooltipPlacement="bottom" tooltipClass="customClass" tooltip="{{UpdateTime}} {{RawValue}}">{{DisplayName }}</span> 

CSS :

.tooltip.customClass .tooltip-inner { 
    -ms-word-break: break-word; 
    word-break: break-word;  
    text-align: center; 
    border:1px; 
    border-style:solid; 
    border-color:black; 
    background-color: lightgray; 
    color: black; 
} 

그것은 툴팁 상자 내에서 중단 있지만 적절한 장소에, 내가 바로 뒤에 줄 바꿈이 필요합니다 {{UpdateTime}} , 두 줄로 정렬하십시오.

감사합니다.

답변

0

어떻게하는지 알아 냈습니다. 도구 설명 대신 tooltipHtml 속성을 사용하고 두 값 사이에 <br/>을 삽입하십시오!

0

(최소) 1.3.3 이상에서는 tooltipHtml이 더 이상 작동하지 않습니다. 대신 템플리트 참조를 사용하십시오.

<template #statusTemplate> 
    lorem ipsum <br /> dolor sit amet 
</template> 
<div.... 
    [tooltip]="statusTemplate" 
</div>