AngularJS - Service is not defined error in function but fine in controller - ReferenceError: systemService is not defined
<p>I'm really new to AngularJS so this might be really obvious! </p>

<p>I've got a service which does some basic checks and then returns the information. I call this service in a controller and in a function. </p>

<p>When I call it in the controller it works fine without an error. </p>

<p>When I call it in the function I get </p>

<blockquote>
  <p>angular.js:9101 ReferenceError: systemService is not defined</p>
</blockquote>

<p><strong>Call to service in Controller that works:</strong> </p>

<pre><code>myApp.controller('continueController', ["$scope", "$rootScope", 'systemService', function ($scope, $rootScope, systemService) {
            $scope.ContinueAngularMethod = function () {

                $rootScope.field = 'payment';
                $scope.field = $rootScope.field;
                $scope.notApp = '1';
                console.log("I don't error in here");
                $scope.ss = systemService.checkDropDownValue($scope.payment.type, $scope.notApp);
                $rootScope.$apply();
            }
        }]);
</code></pre>

<p><strong>Call to service in function that doesn't work:</strong> </p>

<pre><code>function MyCtrl($scope) {

                $scope.changeme = function () {
                    console.log("Drop down changes ideally do something here....");

                    //Call to service  
                    $scope.ss = systemService.checkDropDownValue($scope.payment.type, $scope.notApp);

                    console.log($scope.ss.field);
                    console.log($scope.ss.notAppJ);

                }
</code></pre>

<p><strong>This is my code in full:</strong> </p>

<pre><code>&lt;script type='text/javascript'&gt;

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

        //Set up my service
        myApp.service('systemService', function () {

            this.info = {}; //Declaring the object

            this.checkDropDownValue = function (type, notAppJ) {


                if (type != 'PayPal') {
                    console.log("I am not PayPal");
                    field = 'other'
                    notApp = '0';
                }
                else if (type == 'PayPal' &amp;&amp; notApp == '1') {
                    console.log("i am in the else if - functionality later");
                }
                else {
                    console.log("i am in the else - functionality later");
                }

                this.info.field = type;
                this.info.number = notApp;

                return this.info;
            };

        });

        myApp.controller('continueController', ["$scope", "$rootScope", 'systemService', function ($scope, $rootScope, systemService) {
            $scope.ContinueAngularMethod = function () {

                $rootScope.field = 'payment';
                $scope.field = $rootScope.field;
                $scope.notApp = '1';
                console.log("I don't error in here");
                $scope.ss = systemService.checkDropDownValue($scope.payment.type, $scope.notApp);
                $rootScope.$apply();
            }
        }]);

        function MyCtrl($scope) {

            $scope.changeme = function () {
                console.log("Drop down changes ideally do something here....");

                //Call to service  
                $scope.ss = systemService.checkDropDownValue($scope.payment.type, $scope.notApp);

                console.log($scope.ss.field);
                console.log($scope.ss.notAppJ);

            }

            $scope.myFunct = function (keyEvent) {

            if (keyEvent.which === 13) {
                //They hit the enter key so ignore this 
                keyEvent.preventDefault();
            }

            //Becauase a new child scope is generated you can't use $scope as that refers to the parent . But this refers to the child. 
            var rPromise = findAll(this.softwareText);

            }
        }

    &lt;/script&gt;
</code></pre>

<p>I tried these without any luck: </p>

<p><a href="https://stackoverflow.com/questions/39440866/angular-uncaught-referenceerror-service-is-not-defined">angular Uncaught ReferenceError: Service is not defined</a> </p>

<p><a href="https://stackoverflow.com/questions/30773161/angularjs-referenceerror-is-not-defined">AngularJS - ReferenceError: $ is not defined</a> </p>

<p><a href="https://stackoverflow.com/questions/26921071/initialize-scope-variables-for-multiple-controllers-angularjs">Initialize $scope variables for multiple controllers - AngularJS</a></p>