Download to read offline
![KARTHIKEYAN P
app.js
//IIFE
(function(){
'use strict';
angular.module('myFirstApp',[ ])
.controller('MyFirstController', function() {
});
})();](https://image.slidesharecdn.com/session3-webtools-angularjs-200826103535/85/Web-tools-angular-js-5-320.jpg)
![KARTHIKEYAN P
app.js
(function(){
'use strict';
angular.module('myFirstApp',[])
.controller('MyFirstController', function($scope) {
$scope.name = “karthik”
$scope.sayHello = function() { return “Hai”;}
});
})();](https://image.slidesharecdn.com/session3-webtools-angularjs-200826103535/85/Web-tools-angular-js-7-320.jpg)
![KARTHIKEYAN P
app.js
//IIFE
(function(){
'use strict';
angular.module('myFirstApp',[ ])
.controller('MyFirstController', function() {
});
})();](https://image.slidesharecdn.com/session3-webtools-angularjs-200826103535/75/Web-tools-angular-js-5-2048.jpg)
![KARTHIKEYAN P
app.js
(function(){
'use strict';
angular.module('myFirstApp',[])
.controller('MyFirstController', function($scope) {
$scope.name = “karthik”
$scope.sayHello = function() { return “Hai”;}
});
})();](https://image.slidesharecdn.com/session3-webtools-angularjs-200826103535/75/Web-tools-angular-js-7-2048.jpg)
More Related Content
![[@NaukriEngineering] Mobile Web app scripts execution using Appium](https://cdn.slidesharecdn.com/ss_thumbnails/html5mobilesiteautomationusingappiumdemo-161117070734-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Similar to Web tools - angular js
![[Ebooks PDF] download AngularJS 1st Edition Brad Green full chapters](https://cdn.slidesharecdn.com/ss_thumbnails/18713-241217213105-de1012ed-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Web tools - angular js
- 1. KARTHIKEYAN P Web DevelopmentTools Session 3
- 2. KARTHIKEYAN P Session Outcomes Atthe end of this session, students will be able to, 1. Install and use angular js 2. Run a simple app using angular js
- 3. KARTHIKEYAN P Angular JS •Download Angular JS – (https://angularjs.org) – Use angular.min.js
- 4. KARTHIKEYAN P Angular JS •Files – index.html, app.js, angular.min.js – style.css (optional) • Wrapping your AngularJS components in an Immediately Invoked Function Expression (IIFE). This helps to prevent variables and function declarations from living longer than expected in the global scope, which also helps avoid variable collisions. https://codestyle.co/guidelines/angularjs/
- 5. KARTHIKEYAN P app.js //IIFE (function(){ 'use strict'; angular.module('myFirstApp',[]) .controller('MyFirstController', function() { }); })();
- 6. KARTHIKEYAN P Update index.html •Add angualar app <html ng-app=“myFirstApp”> • Add angular controller <div ng-controller=“myFirstController”>
- 7. KARTHIKEYAN P app.js (function(){ 'use strict'; angular.module('myFirstApp',[]) .controller('MyFirstController',function($scope) { $scope.name = “karthik” $scope.sayHello = function() { return “Hai”;} }); })();
- 8. KARTHIKEYAN P Sharing data- controller • Add angular controller <div ng-controller=“myFirstController”> {{name}} {{sayHello()}} </div>
- 9. KARTHIKEYAN P Sharing data- controller • Add angular controller <div ng-controller=“myFirstController”> <input type="text" ng-model="name"> Inside input box is: {{name}} </div>
- 10.