angularjs : 컨트롤러 모델에서 데이터가 올 수 있도록 지시문을 사용하여 팝업을 처리하는 방법

Question

템플릿 URL에이 태그가 들어 있다고 가정합니다 (HTML은 기본적으로 <li>입니다). 다음과 같이

<div ng-bind-html="accident.description.impact"></div> 

모델의 일부는 다음과 같습니다

"cause": 

"<ul>\n\ 
    <li>\n\ 
    <div><span inline-popover \n\ 
     popover-html=\"Taper pour ouvrir la vue détaillée\" \n\ 
     popover-placement=\"bottom\" \n\ 
     popover-label=\"Larve de taupin\">Larve de taupin</span></div>\n\ 
    </li>\n\ 
    <li>Semences en cours de germination</li>\n\ 
</ul>", 

을 그리고 당신이 볼 수 있듯이, 일부 < 리 >는 팝업을 여는 수 있도록 태그가 포함되어 있습니다.

내가 가진 문제는 스팬이 부분적으로 주입되면 그의 속성에서 분리된다는 것입니다.

아이디어가 있으십니까?

Answer 1

여기의 문제는 ng-bind-html이 단순히 변수의 내용 만 출력한다는 것입니다. 여기에 필요한 것은 추가 지시문을 만들기위한 코드 인 $compiles입니다.

<div ng-compile-html="accident.description.impact"></div> 

자바 스크립트 :

directives.directive("ngCompileHtml", function ($http, $compile) 
{ 
    return { 
     restrict: "A", 
     scope: { 
       "ngCompileHtml": "="    
     }, 
     link: function (scope, element) 
     { 
      var template = angular.element(scope.ngCompileHtml); 
      $compile(template.contents())(scope); 
      $(element).append(template); 
     } 
    }; 
});