Angular Template는 선언 사양이며, 사용자가 모델 및 컨트롤러의 정보와 함께 브라우저에서 볼 수있는보기로 렌더링됩니다. HTML, CSS, 각도 특수 요소 및 각도 지정 요소 속성을 포함한 정적 DOM입니다. 각도 요소 및 속성은 동작을 연장하고 템플릿 DOM을 동적보기 DOM으로 변환하는 각도를 나타냅니다.
다음은 템플릿에서 사용할 수있는 각도 요소의 유형입니다.
참고 : 템플릿에서 위의 요소를 선언하는 것 외에도 JavaScript 코드에서 이러한 요소에 액세스 할 수도 있습니다.
다음 코드 스 니펫은 표준 HTML 태그와 각도 지시어, 브레이스-바운드 표현식 ({{expression}}, //www.vevb.com/article/91742.htm)으로 구성된 간단한 각도 템플릿을 보여줍니다.
<! docType html> <!-NG-App, 응용 프로그램 범위를 정의하고, 루트 스코프 작성-> <html ng-app> <head> <meta http-equiv = "content-type"content = "text/html; charset = utf-8"/> <title> 템플릿 </title> <meta 컨텐츠 = "ie = chrome, chrome = 1" http-equiv = "x-ua-cattible"> <style type = "text/css"> .ng-cloak {display : none; . -> <input type = "text"ng-model = "foo"value = "/> <!-ng-click, directive, 클릭 후해야 할 일 (buttontext = '1”과 같은 표현식이 될 수 있습니다. 또는 아래와 같이 호출 함수 일 수 있습니다. {{buttonText}}, 현재 스코프 체인에서 또는 얻을 수있는 buttonText의 값을 표시하는 데 사용됩니다 .-> <button ng-click = "changefoo ()"> {{buttontext}} </button> <script src = "../ cagnular-1.0.1.js"type = "text/javascript"> </javascript "> </javascript myController ($ scope) {$ scope.buttontext = "default stuff"; // 모델 buttontext $ scope.foo = "modify me"; // model foo $ scope.changefoo = function () {// changefoo declare this.buttontext = this.foo; }; } </script> </body> </html>간단한 단일 페이지 응용 프로그램에서 템플릿은 HTML, CSS 및 Angular Directive로 구성되며 모두 HTML 파일 (일반적으로 Index.html이라고 함)에 포함됩니다. 그러나 몇 가지 복잡한 응용 프로그램에서는 "Partials"를 사용하여 한 페이지에 여러 뷰를 표시 할 수 있습니다. 즉, 템플릿 세그먼트를 별도의 HTML 파일에 저장합니다. 우리는 $ Route Service (http://code.angularjs.org/1.0.2/docs/api/ng.$ route)와 ngview directive (http://code.angularjs.org/1.0.0.2/docs/api/api/ng.dirview)를 사용할 수 있습니다. 이 기술의 예는 각도 자습서 (http://code.angularjs.org/1.0.2/docs/tutorial/index)의 일곱 번째 및 여덟 번째 단계에 나와 있습니다. (나중에이 부분으로 연주 할게 -_-!)
위의 것은 Angularjs가 Angular Template를 이해하는 것에 대한 정보 모음입니다. 우리는 향후 관련 정보를 계속 추가 할 것입니다. 이 사이트를 지원 해주셔서 감사합니다!