AngularJS - Basic

Services

by Ryan Morris

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="container" ng-app="myApp">
    
    <div ng-controller="MainCtrl">
        
        <p>{{name}}</p>
        
    </div> 
    
</div>

JavaScript

var myApp = angular.module('myApp', []);

myApp.controller('MainCtrl', ['$scope', '$log', function($scope, $log) {
    
    $scope.name = "Ryan";
    
    $log.log("Hi!"); // similar to console.log
    
}]);

myApp.controller('SecondCtrl', function($scope, $log) {
    
    $scope.name = "Ryan";
    
    $log.log("Hi!"); // similar to console.log
    
});

myApp.controller('ThirdCtrl', ['$scope', '$log', function(s, l) {
    
    s.name = "Ryan";
    
    l.log("Hi!"); // similar to console.log
    
}]);