Область применения - специальный объект javascript, который играет роль соединения контроллера с представлениями. Область содержит данные модели. В контроллерах доступ к данным модели осуществляется через объект $scope.

<script>
   var mainApp = angular.module("mainApp", []);
  
   mainApp.controller("shapeController", function($scope) {
      $scope.message = "In shape controller";
      $scope.type = "Shape";
   });
</script>

Ниже приведены важные моменты, которые следует учитывать в приведенном выше примере.

  • $Scope передается как первый аргумент контроллеру во время определения его конструктора.
  • $Scope.message и $ scope.type - это модели, которые должны использоваться на странице HTML.
  • Мы установили значения для моделей, которые будут отображаться в прикладном модуле, контроллер которого является shapeController.
  • Мы также можем определять функции в $scope.

Внимание!!!

Если примеры не отображаются на странице или искажены, проверьте не блокирует ли их браузер!

Opera

Свободу АНГУЛЯРУ в Opera!!! )))

Google Chrome

Свободу АНГУЛЯРУ в Google Chrome!!! )))

Mozilla Firefox

Свободу АНГУЛЯРУ в Mozilla Firefox!!! )))

Yandex

Свободу АНГУЛЯРУ в Yandex!!! )))

Наследование

Область применения - это специальные контроллеры. Если мы определяем вложенные контроллеры, то дочерний контроллер будет наследовать область его родительского контроллера.

<script>
   var mainApp = angular.module("mainApp", []);
  
   mainApp.controller("shapeController", function($scope) {
      $scope.message = "In shape controller";
      $scope.type = "Shape";
   });
  
   mainApp.controller("circleController", function($scope) {
      $scope.message = "In circle controller";
   });
           
</script>

Ниже приведены важные моменты, которые следует учитывать в приведенном выше примере.

  • Мы установили значения для моделей в shapeController.
  • Мы переопределили сообщение в контроллере circleController. Когда «сообщение» используется в модуле контроллера circleController, будет использоваться переопределенное сообщение.

Пример

В следующем примере будут показаны все вышеупомянутые директивы.

<html>
   <head>
      <title>Angular JS Forms</title>
   </head>
  
   <body>
      <h2>AngularJS Sample Application</h2>
     
      <div ng-app = "mainApp" ng-controller = "shapeController">
         <p>{{message}} 
 {{type}} </p>
        
         <div ng-controller = "circleController">
            <p>{{message}} 
 {{type}} </p>
         </div>
        
         <div ng-controller = "squareController">
            <p>{{message}} 
 {{type}} </p>
         </div>
                                    
      </div>
                       
      <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
     
      <script>
         var mainApp = angular.module("mainApp", []);
        
         mainApp.controller("shapeController", function($scope) {
            $scope.message = "In shape controller";
            $scope.type = "Shape";
         });
        
         mainApp.controller("circleController", function($scope) {
            $scope.message = "In circle controller";
         });
        
         mainApp.controller("squareController", function($scope) {
            $scope.message = "In square controller";
            $scope.type = "Square";
         });
                                    
      </script>
     
   </body>
</html>

Результат

Откройте textAngularJS.htm в веб-браузере.


Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!



Cookies make it easier for us to provide you with our services. With the usage of our services you permit us to use cookies.
Ok