Angularjs 지시어 + $ 컴파일해야합니까

Question

landingPage-builder 프로젝트에서 몇 가지 지침이 필요합니다. (나는 현재 붙어있다!).

주요 문제는 다음과 같습니다. 템플릿의 각 요소 (예 : h1 및 단락)에 지시문이 첨부되어 있습니다. 지시문을 얻으려면 다음을 수행해야합니다. ng-click, ng-options 등과 같이 첨부 된 다른 지시문을 사용하여 HTML 템플릿을 만들고 모델에 바인딩을 그대로 유지하고 (현재는 멀리 떨어져있는 상태) 모델을 업데이트합니다. 변경되었습니다.

지시어가있는 요소를 추가하거나 바꾸지 않고 html 템플릿을 만들어 DOM에 삽입하면 (왼쪽에서 본 모델을 업데이트 할 수 있음) 오른쪽의 "설정"상자에서

이 프로젝트는 여기에서 볼 수 있습니다 : http://193.107.29.196/~stian123/landingPageV3/app/#/pagebuilder/2

당신이해야 할 수도 크롬-Control-Allow-Origin :을 허용 : 나는 약 $ 컴파일 조금 혼란 스러워요 정말 때 모르는 https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related

을 api의이 부분을 사용해야합니다.

제안 사항? 감사합니다.

Answer 1

질문을 올바르게 이해했다면 템플릿 중 일부에 각도 속성이 포함 된 템플릿을 동적으로 만들고 DOM에 첨부하려고합니다.

첫째,에 (희망) 컴파일 $를 호출하는 경우에 대한 귀하의 질문에 대답 :

당신이에서 각도의 템플릿 시스템 외부 HTML에로드 할 때마다 (설정하려고처럼 $ (요소) .html 중에서 (myHtmlString)) , Angular가 DOM에 첨부하기 전에 그것을 컴파일해야합니다. 즉,

이렇게하면 Angular가 DOM을 통과하고 모든 지시문과 바인딩을 구문 분석하여 제공된 범위에 첨부 할 수 있습니다. $ compile하지 않으면, Angular는 의도 된 바인딩에 대해 전혀 모른다. HTML은 Angular로 읽히지 않는다.

둘째로 템플릿을 얼마나 유연하게 만들지 모르겠지만 상대적으로 고정되어 있지만 고정 된 맞춤 설정 가능한 옵션 (텍스트, 색상, 글꼴 크기 등)을 사용하면 더 나아질 수 있습니다. 지시문의 범위에 바인딩 된보기 옵션으로 각 '보기'에 대한 지시문을 작성합니다. 그런 다음 오른쪽 패널의 지시문 범위에서 필드를 변경하면보기가 직접 업데이트됩니다. 이 경우에는 $ compile을 사용할 필요조차 없습니다.

사용자가 템플릿 HTML 코드를 수동으로 추가 할 수있게하려면 위에서 설명한대로 HTML을 컴파일해야합니다.