dir.by  
  Search  
Programming, development, testing
AngularJS (это Angular версии 1.0)
Примеры "Односторонняя привязка данных (показываем данные)" в AngularJS
  Looked at 4749 times    
 Примеры "Односторонняя привязка данных (показываем данные)" в AngularJS 
last updated: 28 September 2019
Пример1 (одна переменная)
  Html  
<html>
<body>

     <!-- загружаем библиотеку AngularJS -->
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

     <!-- HTML элементы -->
     <div ng-app="myApp" ng-controller="myCtrl">
          My name is {{name}}
     </div>

     <!-- Java Script -->
     <script>
          // создаем AngularJS модуль с именем 'myApp'
          var app = angular.module('myApp', []);

          // создаем AngularJS контроллер с именем 'myCtrl'
          app.controller('myCtrl', function($scope) {
               $scope.name = "Evgen";
          });
     </script>

</body>
</html>
Example we look, we test
Объяснение примера!
Сервис $scope в AngularJS следит за всеми изменениями.
Мы в $scope добавили переменную name
  Html  
<script>
     ...
     app.controller('myCtrl', function($scope) {
          $scope.name = "Evgen";
     });
</script>
HTML текст привязывается к name через двойные фигурные скобки {{...}}
  Html  
My name is {{name}}
Пример2 (две переменных)
  Html  
<html>
<body>

     <!-- загружаем библиотеку AngularJS -->
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

     <!-- HTML элементы -->
     <div ng-app="myApp" ng-controller="myCtrl">
          {{firstName + ' ' + lastName}}
     </div>

     <!-- Java Script -->
     <script>
          // создаем AngularJS модуль с именем 'myApp'
          var app = angular.module('myApp', []);

          // создаем AngularJS контроллер с именем 'myCtrl'
          app.controller('myCtrl', function($scope) {
               $scope.firstName = "Evgen";
               $scope.lastName = "AAA";
          });
     </script>

</body>
</html>
Example we look, we test
 
← Previous topic
Что такое AngularJS ?
 
Next topic →
Пример "двусторонняя привязка данных" ng-model в AngularJS
 
Your feedback ... Comments ...
   
Your Name
Your comment (www links can only be added by a logged-in user)

  Объявления  
  Объявления  
 
Что такое AngularJS ?
Примеры
Примеры "Односторонняя привязка данных (показываем данные)" в AngularJS
Пример "двусторонняя привязка данных" ng-model в AngularJS
Пример "Функция для обрабоки события и привязка к данным" ng-click в AngularJS
Дополнительные темы, вопросы
$scope в AngularJS
WWW сайты для изучения AngularJS
Сайты для изучения AngularJS

  Ваши вопросы присылайте по почте: info@dir.by  
Яндекс.Метрика