2014-01-15 2 views
1

내가 AngularStrap의 BS-툴팁의 내부 title 속성을 자신의 지침 (checkStrength)와 <ul> 요소를 가지고 노력하고 평가되지 않습니다 :지침은 다음과 같이

$scope.tooltip = { 
    title: '<ul id="strength" check-strength="pw"></ul>', 
    checked: false 
}; 

내가 원하는 동작을 사용자가 입력란을 클릭하면 텍스트 상자에 입력 할 때 암호의 강도를 보여주는 툴팁이 나타납니다.

아래의 두 Plunkers 같이이 작동하지 않습니다

이 BS-툴팁 외부

사용자 정의 "checkStrength"지시문이 잘 작동 : BS-툴팁 내부 Plunker

사용자 정의 "checkStrength"지시문이 작동하지 않습니다 : Plunker

+0

이 중복 질문입니다. 나는 그것을 여기에 답했다 : http://stackoverflow.com/questions/21126071/angularstrap-tooltip-disables-my-custom-directive/21126493#21126493 – Rob

+0

@Rob : 명확히하기 위해, 이것은 별도의 질문이다. 툴팁 안에 "checkStrength"지시어를 포함하는 ul을 삽입하고 싶습니다. 다른 질문에서 저는 툴팁 외부에 ul 태그가있었습니다 (그 문제는 이제 해결되었습니다). –

+0

죄송 내 잘못. – Rob

답변

2

좋아, 이것은 기본적으로 지원되지 않는 것으로 보입니다. 당신은이 각도 스트랩 코드로 가서 plunker에 tooltip.js 라인 (10)에 대한 후속 수정을

지침에게 자신의 바인딩 지침

.directive('customBindHtml', function($compile) { 
    return { 

    link: function(scope, element, attr) { 
      scope.$watch(attr.customBindHtml, function (value) { 
       element.html(value); 
       $compile(element.contents())(scope); 
      }); 
    } 
    }; 

}); 

을 생성해야 할 것

템플릿

<div class="tooltip-inner" custom-bind-html="title"></div> 

그런 다음 HT 설정 ml 속성을 false로 설정하십시오.

구성

.config(function($tooltipProvider) { 
    angular.extend($tooltipProvider.defaults, { 
    html: false 
    }); 
}) 


예 :Plunker