Drop Down MenusCSS Drop Down MenuPure CSS Dropdown Menu

Monday, 2 May 2016

Nested Controller



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