JSFiddle - React, Tailwind, and code Playground

by Garth Edwards

HTML

<script src="http://code.angularjs.org/1.3.5/angular.js"></script>
<div ng-app="myApp">
    <div ng-controller="Controller_1">
        myName :<br>
        {{myName}}<br>
        <br>
        testJsFunction :<br>
        {{testJsFunction}}<br>
        <br>
        myNameAfterService :<br>
        {{myNameAfterService}}<br>
        <br>
    </div>
</div>

JavaScript

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

myApp.controller('Controller_1', ['$scope', 'Service_1', function($scope, Service_1) {

    //check to see that the service function is accessible 
        console.log('Service_1.serviceVariable :', Service_1.serviceVariable);
    
    var myName = "Ben";

    var jsonlyfunction = function(name){
        name = name + " is learning Angularjs";
        return name;
    };
    var testJsFunction = jsonlyfunction(myName);

    var myNameAfterService = Service_1.serviceVariable(myName);
        console.log('myNameAfterService', myNameAfterService);

    //add variables to scope so we can output them
    $scope.myName = myName;
    $scope.testJsFunction = testJsFunction;
    $scope.myNameAfterService = myNameAfterService;
    
}]);

myApp.service('Service_1', function() {

    this.serviceVariable = function(name){
        name = name + " is learning Angularjs";
        return name;
    };
    
});