<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="/path/to/angular.js"></script>
</head>
<body ng-controller="HelloCtrl">
{{ message }}
</body>
</html>
angular.module('app',[])
.controller('HelloCtrl', function($scope) {
$scope.message = 'Hello Angular World!';
});
<chart data="reportData" type="pie"></chart>
<map center="{lat:37.0625, lon:-95.677068"></map>
<tabPanel>
<tab title="'Tab1'">content</tab>
<tab title=''Tab2'">more</tab>
</tabPanel
app.controller('ReportsCtrl',
function($scope, $http, d3) { $http.get('/path/to/data').success(function(data) { //use d3 here to visualize the data }); });
<chart type="pie" data="data"></chart>
<div id="chart"></div>
<script>
$(document).ready(function() {
$('#chart').callSomeChartPlugin({
type: 'pie',
data: data
});
});
</script>
<div ng-controller="ProductsCtrl">
<div ng-controller="BaseCtrl">
<div ng-controller="ChildCtrl">
....
</div>
</div>
var app = angular.module('myApp', []);
app.controller('ParentCtrl ', function($scope) { // some common logic here }); app.controller('ChildCtrl', function($scope, $controller) {
// add child logic to $scope $controller('ParentCtrl', {$scope: $scope}); });
<div ng-controller="FirstCtrl"> <div ng-controller="SecondCtrl"> <div ng-controller="ThirdCtrl">