Index.html
<!DOCTYPE html>
<html ng-app="myapp" >
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-route.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.min.css">
<script src="../Controller/app.js"></script>
<script src="../Controller/MyController.js"></script>
<link rel="stylesheet" type="text/css" href="../Style/style.css">
<title></title>
</head>
<div ng-controller="ParentController">
{{message}}
<div ng-controller="ChildController">
{{message}}
<div ng-controller="GrandSonController">
{{message}}
</div>
</div>
</div>
</html>
app.js
var app = angular.module('myapp', []);
app.controller('ParentController', ['$scope', function($scope){
$scope.message="parent";
}]).
controller('ChildController', ['$scope', function($scope){
}]).
controller('GrandSonController', ['$scope', function($scope){
$scope.message="Grandson";
}])

No comments:
Post a Comment