Latest web development tutorials

컨트롤러 AngularJS와

AngularJS와 AngularJS와 데이터 컨트롤러 응용 프로그램.

AngularJS와 컨트롤러는 일반 자바 스크립트 객체입니다.


컨트롤러 AngularJS와

AngularJS와 응용 프로그램 컨트롤러입니다.

NG 컨트롤러 지시어는 응용 프로그램 컨트롤러를 정의합니다.

제어기는 표준 자바 스크립트 객체의 생성자에 의해 생성 된 자바 스크립트 객체이다.

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "myCtrl">

이름 : <입력 유형 = "텍스트" NG 모델 = "firstName을">로 <br>
성 : <입력 유형 = "텍스트" NG 모델 = "이 lastName">로 <br>
로 <br>
이름 : {{firstName을 + ""+ 이 lastName}}

</ DIV>

<스크립트>
var에 응용 = angular.module ( '을 myApp', []);
app.controller ( 'myCtrl', 기능 ($ 범위) {
$ Scope.firstName = "존";
$ Scope.lastName = "미상";
});
</ 스크립트>

»시도

애플리케이션 분석 :

NG-응용 프로그램에 의해 정의 된 응용 프로그램을 AngularJS와. <DIV> 내부에서 실행되는 응용 프로그램.

NG 컨트롤러 = "myCtrl은?"속성은 AngularJS와 명령어입니다. 이는 제어기를 정의하는 데 사용된다.

myCtrl 기능은 자바 스크립트 기능입니다.

컨트롤러를 호출 $ 범위 개체를 사용 AngularJS와.

AngularJS와에서 $ 범위 (응용 프로그램에 속하는 변수와 함수)와 같은 응용 프로그램입니다.

(범위, 제어 범위에 해당) 컨트롤러 $ 범위는 AngularJS와 모델 (모델) 개체를 저장합니다.

컨트롤러 범위는 두 가지 속성 (firstName과 lastName 속성)를 만들었습니다.

속성 컨트롤러에 NG 모델 지시 바인드 입력 필드 (firstName과 lastName 속성).


컨트롤러 방법

위의 예는 두와 컨트롤러 객체와 이름 성 속성을 보여줍니다.

제어기는 방법 (함수와 변수)를 가질 수있다 :

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "personCtrl">

이름 : <입력 유형 = "텍스트" NG 모델 = "firstName을">로 <br>
성 : <입력 유형 = "텍스트" NG 모델 = "이 lastName">로 <br>
로 <br>
이름 : {{fullName의 ()}}

</ DIV>

<스크립트>
var에 응용 = angular.module ( '을 myApp', []);
app.controller ( 'personCtrl', 기능 ($ 범위) {
$ Scope.firstName = "존";
$ Scope.lastName = "미상";
$ Scope.fullName = 함수 () {
반환 $ scope.firstName + ""+ $ scope.lastName;
}
});
</ 스크립트>

»시도

외부 파일 제어기

많은 응용에서, 제어기는 일반적으로 외부 파일에 저장된다.

단순히 <script> 태그를 복사라는 코드를 넣어 personController.js 외부 파일이 될 수 있습니다 :

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "personCtrl">

이름 : <입력 유형 = " 텍스트"NG 모델 = "firstName을">로 <br>
성 : <입력 유형 = " 텍스트"NG 모델 = "이 lastName">로 <br>
로 <br>
전체 이름 : {{firstName을 + " "+이 lastName}}

</ DIV>

<스크립트 SRC = "personController.js"> </ script>

»시도

다른 예

다음 예제에서는 새 컨트롤러 파일을 생성합니다 :

angular.module ( '을 myApp', []). 컨트롤러 ( 'namesCtrl', 기능 ($ 범위) {
$ Scope.names = [
{이름 : '야니'국가 '노르웨이'}
{이름 : 'Hege'국가 '스웨덴'}
{이름 : '카이'나라 '덴마크'}
]
});

로 파일 저장 namesController.js를 :

그리고, 프로그램 파일 컨트롤러를 사용 :

예를 AngularJS와

<사업부의 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "namesCtrl">

<UL>
<리 NG 반복 = "X 이름에">
{{X.name + ','+ x.country}}
</ 리>
</ UL>

</ DIV>

<스크립트 SRC = "namesController.js"> </ script>

»시도