I am new to Angular and Umbraco 7 :)

Got the new section to load in Umbraco as expected. But I can't seem to wire up the Angular part of the equations.

In App_Plugins I have a file called magazine.DeleteController.Js

angular.module('umbraco').controller('magazine.DeleteController',
    function ($scope, $routeParams, customerResource, notificationsService, navigationService, $location, treeService) {

        $scope.Delete = function (id) {
            notificationsService.success("Success", "Magazine has been deleted");
        };

        $scope.Cancel = function () {
            navigationService.hideNavigation();
        };
    });

In my delete.html I have the following

<umb-panel ng-controller="magazine.DeleteController">
    <p>
        Are you sure you want to delete {{currentNode.name}} ?
    </p>
    <div>
        <div class="umb-pane btn-toolbar umb-btn-toolbar">
            <div class="control-group umb-control-group">
                <a href="" class="btn btn-link" ng-click="Cancel()"><localize key="general_cancel">Cancel</localize></a>
                <a href="" class="btn btn-primary" ng-click="Delete(currentNode.id)"><localize key="general_ok">OK</localize></a>
            </div>
        </div>
    </div>
</umb-panel>

If I look in chrome console i see the error.

Error: Argument 'magazine.DeleteController' is not a function, got undefined
    at Error (native)

What am I missing?

Thanks!