Angular JS : 자바 스크립트 함수에서 지시어 내용을 사용할 수 없습니다.

Question

인 div이 있습니다. 그 div을 클릭하면 지시문에서 스크립트 내용을 가져 오는 함수를 호출하고이를 div에 추가하고 스크립트의 내용에 액세스합니다. 그러나 지시문의 내용을 검색 할 때 지시문에 내용이 아니라 이름이 지정됩니다. 나는 그 내용을 얻고 싶다.

이 기능은 내가 전화 :

$scope.someFunction = function(){ 
    var appendHtml = $compile("<my-custom-directive></my-custom-directive>")($scope); 
    $("#someId").append(appendHtml) 
    //But when i append I am seeing as <my-custom-directive></my-custom-directive> in html not the actual content 

    $(""#someId"").find('script') 
} 

지침 :

app.directive('myCustomDirective', function ($compile) { 
    return { 
    restrict: 'E', 
    templateUrl: '/somecontent.html', 
    replace: true, 
    link: function ($scope, elem, attr, ctrl) {} 
    }; 
}); 

Somecontent.html

<script type="text/template"> 
    <div class="arrow" style="left: 50%;"></div> 
    some elements here 
    </div> 
</script> 

나는에서 부르는 HTML :

<div ng-click="someFunction()"> 
    <div id="someId"> 
    <my-custom-directive></my-custom-directive> 
    //But Here I am seeing this, when calling 
    $(appendHtml).find('script') in my javascript function, after Javasciprt function call is done, It works fine. But i want to see actual content here when calling $(""#someId"").find('script') 
    <div> 
</div> 

Answer 1

좋지 않습니다.

사용할 수있는 NG-경우와 follwing을 같이하는 대신 바인딩 :

<div ng-click="someFunction()"> 
    <div id="someId"> 
    <div ng-if="$scope.isVisible"> 
      <my-custom-directive></my-custom-directive> 
    </div> 
    //But Here I am seeing this, when calling 
    $(appendHtml).find('script') in my javascript function, after Javasciprt function call is done, It works fine. But i want to see actual content here when calling $(""#someId"").find('script') 
    <div> 
</div> 

컨트롤러

HTML :

$scope.isVisible = false; 

$scope.someFunction = function(){ 
    $scope.isVisible = true; 
} 

당신은 또한 당신의 지시에 범위 PARAM을 분리 전달할 수 있으며, 지시문 템플릿의 매개 변수를 확인하십시오.

Answer 2

jQuery 또는 jqLite를 사용하여 요소를 올바르게 선택하지 마십시오.

귀하의 someFunction는 다음과 같이 더 볼 필요가 있습니다

vm.someFunction = function() { 
    var appendHtml = $compile('<my-custom-directive></my-custom-directive')($scope); 
    angular.element(document).find('some-id-element').append(appendHtml); 
}; 

내가 함께 난 당신이 뭘 하려는지 달성 있다고 생각 this plunk을 넣어.

대략적인 목표입니까?