Angular x
The initial version and the original version of the Angular framework is Angular 1.x. There are, any concepts related to Angular 1.x that are used in building web applications.
- Two-Way Data Binding: In the Angular 1.x version, the concept of Two-Way Data Binding is seen in which the changes done to the User Interface are automatically reflected in the attached data model and also vice versa.
- Directives: Angular 1.x mostly relies on directives that are the extended HTML with some custom behavior embedded into it. Directives allow programmers and developers to design reusable UI-based components and also provision them to manipulate the DOM elements.
- Scope: Angular 1.x uses the concept called scope, which acted as the bridge between the View and Controller layer. It initializes the communication between different components in the developing application.
Example: This example illustrates the basic implementation of the Angular 1.x version.
HTML
<!DOCTYPE html> <html ng-app="myApp"> <head> <script src= "https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"> </script> </head> <body> <div ng-controller="MyController"> <h1>Hi, {{ name }}!</h1> </div> <script> angular.module('myApp', []) .controller('MyController', function ($scope) { $scope.name = 'w3wiki Team'; }); </script> </body> </html> |
Explanation: In the above example, the Angular 1.x code relies on the directives and scope. The code written in JavaScript specifies the application module with its controller name as “MyController“. The controller sets the “name” property on the scope.
Output:
Hi, w3wiki Team
Differences between Angular 1.x and Angular2+
Angular is a well-known JavaScript framework that is used to create awesome responsive web applications like ReactJS. Angular 1.x, is the version that is considered s the initial version of the main framework, while Angular 2+ is considered the subsequent version which also includes Angular 2, Angular 4, Angular 5, and many more. There are some significant changes and enhancements in Angular 2+ as compared to Angular1.x. In this article, we will understand Angular 2+ and Angular 1.x along with their basic implementation & will see the difference between these versions.