AngularJS 응용 프로그램을 만들려면 아래 단계를 따르십시오
1 단계 : 프레임로드
순수한 JavaScript 프레임 워크로서 <Script> 태그를 사용하여 추가 할 수 있습니다.
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script>
2 단계 : NG-App 지시문을 사용하여 AngularJS 응용 프로그램을 정의하십시오
<div ng-app = ""> ... </div>
3 단계 : NG 모델 지침으로 정의 된 패턴 이름
<p> 이름을 입력하십시오 : <input type = "text"ng-model = "name"> </p>
4 단계 : NG-Bind 지시문을 사용하여 위 모델의 값 정의를 바인딩합니다.
<p> hello <span ng-bind = "name"> </span>! </p>
AngularJS 응용 프로그램을 실행하려면 아래 단계를 따라하십시오
HTML 페이지에서 위에서 언급 한 세 단계를 사용하십시오.
testangularjs.html
<html> <title> angularjs 첫 번째 응용 프로그램 </title> <h1> 샘플 응용 프로그램 </h1> <div ng-app = ""> <p> 내 이름 : <input type = "text"ng-model = "name"> </p> <p> hello, <span ng-bind = "name">! </p> </p> </p> </p> </p> </p> <p> src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script> </body> </html>
산출
웹 브라우저에서 Open TextAngularjs.html. 이름을 입력하고 결과를 확인하십시오.
AngularJ를 HTML과 통합하는 방법
NG-APP 지시문은 AngularJS 응용 프로그램의 시작을 나타냅니다.
NG-Model 지시문은 HTML 페이지에 "이름"이라는 모델 변수를 생성하고 Div에 사용 된 NG-App 지시문이 있습니다.
NG-BIND는 사용자가 텍스트 상자에 무언가를 입력하는 한 모델 이름을 HTML SPAN 태그에 표시합니다.
끝 </div> 태그는 AngularJS 응용 프로그램의 끝을 나타냅니다.
위는 간단한 AngularJS 응용 프로그램입니다. 우리는 향후 관련 정보를 계속 구성 할 것입니다. 이 웹 사이트를 지원 해주셔서 감사합니다.