본문 바로가기

AngularJS

[AngularJS] contorller

이전에 AngularJS에 대해 간단히 알아보았습니다.


이번에는AngularJS의 컨트롤러에 대해 알아보겠습니다.


앞에서 ng-app, ng-model이라는 걸 봤었습니다. 


AngularJS의 controller는 ng-controller라는 속성을 부여하면 됩니다.


angularjs는 컨트롤러 단위로 바인딩을 합니다.


아래를 보면


<!DOCTYPE html>

<html ng-app>

<head>

    <title></title>

    <script src="angular.js"></script>

    <script>

        function controller1($scope){

            $scope.text='controller1';

        }

        function controller2($scope){

            $scope.text='controller2';

        }

    </script>

</head>

<body>

    <div ng-controller="controller1">

        {{text}}

    </div>

    <div ng-controller="controller2">

        {{text}}

    </div>

</body>

</html>


위 코드를 실행시켜보면 


controller1과 controller2가 나오게 됩니다.


{{text}}가 두개 들어 있지만 controller가 달라 서로 다른 글자를 보여줍니다.


controller 매개변수 $scope는 뷰와 컨트롤러 사이를 연결해 주는 역할을 합니다.


$scope를 통해 데이터를 전달합니다.


'AngularJS' 카테고리의 다른 글

[AngularJS] 데이터 바인딩과 필터  (0) 2013.10.30
[AngularJS] 설정 및 시작하기  (0) 2013.10.04