Views in AngularJS
- 24-07-2022
- Toanngo92
- 0 Comments
Most understandable, views are what users see on the application.
The HTML5 code will be rendered by the browser to be displayed to the user, known as the view, or user interface.
<!DOCTYPE html> <html lang="en" ng-app="exampleviewApp"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Example View AngularJS</title> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script> </head> <body ng-controller="mainController"> <h2>Hello {{name}}</h2> <input type="text" ng-model="name" /> </body> <script> var exampleviewApp = angular.module('exampleviewApp', []); exampleviewApp.controller('mainController', function($scope) { $scope.name = 'Toanngo92'; }); </script> </html>
Results when printing to the browser
In the example below, we see the browser displays the word hello, with a text box rendered according to the HTML code, looking at the code structure above, we see inside the body there is a directive ng-controller= "mainController" , the content inside is the views returned to the user from the controller named mainController in the script layer.
There can be one or more views in an angularJS application depending on the size of the project, usually many views, each view will be a different interface displayed for users to interact, this is the building platform. should apply SPA (single page application). For that reason, angularJS is very useful in building SPA applications.