2014-12-14 2 views
0

내가 어떤 각도 변수를 포함하는 HTML 파일을 캐시하기 위해 노력하고있어,하지만 난 DOM에 파일 내용을 추가 할 때, 모든 변수가 {{ variable.name.here }}

같은 단지 일반 텍스트입니다

$http.get('app/shared/partials/raise-error.html').then(function(res){ 
    $templateCache.put('raiseErrorBlock', res.data); 
}); 
을 ... 그리고이 인상-error.html (의 일부)입니다 : 나는이 같은 $ http.get와 HTML 파일을 검색하는거야 난

<div id="raiseError" ng-show="errorParams.raise" class="slide-down"> 
    <div class="raiseErrorWrapper"> 
     <div class="rew-header"> 
      <i class="fa fa-bug"></i> 
      <span class="rewh-title">{{ errorParams.title }}</span> 
     </div> 
    </div> 
</div> 

깡패 어떤 문제에 대해서도 run() 블록 안에 $ http.get을 넣는다.

EDIT : 내가 볼 수있는 것은 templateCache 문제입니다. templateCache는 변수를 지원합니까 아니면 정적 데이터 만 캐시 할 수 있습니까?

답변

0

각도 식을 제대로 작동 시키려면 $compile 서비스를 사용해야합니다.

var $el = $compile('<div>{{myData}}</div>')(scope); 
$body.append($el); // wrapped $body with jqLite 

으로 ngdoc는 말한다 :

$ 컴파일이 - 템플릿에 HTML 문자열 또는 DOM을 컴파일하고 에게 다음 범위를 연결하는 데 사용할 수있는 템플릿 함수 및 템플릿을 생성 함께.

더 짧은 방법으로 $ templateCache에 항목을 저장할 수도 있습니다. 예 :

$http.get('http://myserver.com/file.html', { 
    cache: $templateCache 
}).then(function(response) { 
    // do sth 
}); 

나는 또한 당신을 위해 plnkr을 만들었습니다. 희망이 당신을 도울 것입니다. http://plnkr.co/edit/ls4kllAvdVb3qMvm3mBA?p=preview

+0

감사합니다. 작동합니다! 나는이 서비스를 내부에서 사용하고 싶다면, (scope)를 ($ rootScope. $ new())로 대체해야한다고 본다. – tbutcaru

+0

예를 들어 같은 코드를 사용한다면 정확히 말한 것이 아니다. 컨트롤러를 사용하려면 $ compile도 사용해야합니다. 명확히하기 위해 DOM에 수동으로 뭔가를 삽입하려면 템플릿 함수 ($ compile 서비스에서 반환)에 범위를 삽입해야합니다. – hinok

+0

실제로 $ compile을 사용해야하지만, 서비스에서는 $ scope를 삽입 할 수는 없지만 $ rootScope를 삽입 할 수 있으므로''var scope = $ rootScope. $ new();''$ compile (html) (scope)''이 동작하도록합니다. – tbutcaru