Hello, AngularJS! |
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8" /> <title>AngularJS TIPS</title> </head> <body ng-controller="myController"> <div>{{msg}}</div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> <script> angular.module('myApp', []); angular.module('myApp') .controller('myController', function($scope) { $scope.msg = 'Hello, AngularJS!'; }); </script> </body> </html> |
<html ng-app="myApp"> |
angular.module('myApp', []); angular.module('myApp') .controller('myController', function($scope) { $scope.msg = 'Hello, AngularJS!'; }); |
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> </head> <body ng-controller="myController"> <div>{{msg}}</div> <script> var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.msg = 'Hello, AngularJS!'; }); </script> </body> </html> |
var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.msg = 'Hello, AngularJS!'; }); |
<!doctype html> <html ng-app="myApp"> <head> <meta charset="utf-8" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> </head> <body> <div ng-controller="myController"> {{msg}} </div> <script> var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.msg = 'Hello, AngularJS!'; }); </script> </body> </html> |
<div ng-controller="myController"> {{msg}} </div> |
<!doctype html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script> <script> var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.message = 'Hello world!'; }); </script> </head> <body> <div ng-app="myApp"> <div ng-controller="myController"> {{message}} </div> </div> </body> </html> |
var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.message = 'Hello world!'; }); |
<div ng-app="myApp"> <div ng-controller="myController"> {{message}} </div> </div> |
<!doctype html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script> <script> var app = angular.module('myApp', []); app.controller('myController', function() { this.message = 'Hello world!'; }); </script> </head> <body> <div ng-app="myApp"> <div ng-controller="myController as myCtrl"> {{myCtrl.message}} </div> </div> </body> </html> |
app.controller('myController', function() { this.message = 'Hello world!'; }); |
<div ng-controller="myController as myCtrl"> {{myCtrl.message}} </div> |
var app = angular.module('myApp', []); app.controller('myController', function($scope) { $scope.message = 'Hello world!'; }); |
<div ng-controller="myController"> {{message}} </div> |
<!doctype html> <html ng-app="myApp"> <head> <meta charset="utf-8" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script> <script> angular.module('myApp', []); // myApp モジュールを新規に作成 angular.module('myApp') .controller('myController', ['$scope', function(s) { s.msg = 'Hello, AngularJS!'; }]); </script> </head> <body ng-controller="myController"> <div>{{msg}}</div> </body> </html> |
<script> angular.module('myApp', []); // myApp モジュールを新規に作成 var My = function(s) { s.msg = 'Hello, AngularJS!'; }; My.$inject = ['$scope']; angular.module('myApp').controller('myController', My); </script> |
angular.module('myApp', ['myAppService']) |