How to create a controller for the index.html page?

I have a button in the index which on-tap should perform a function.

just simple, @kpdarshan03

in your /js/controller.js, define your own controllers.

ex)

angular.module('starter', [])
controller('SideMenuCtrl', function ($scope) {
        $scope.click = function (item) {
            if (item.id == 1) {
                window.location = '#/menu/2';
            } else if (item.id == 2) {
                window.location = '#/menu/3';
            } else if (item.id == 3) {
                window.location = '#/menu/4';
            } else if (item.id == 4) {
                window.location = '#/menu/14';
            } else if (item.id == 5) {
                window.location = '#/menu/5';
            }
        };
  })

and in stateRouteProvider(js/app.js), define ‘controller:’ attribute to apply controllers into index.html

angular.module('starter', [])
.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider.state('menu', {
        url: "/menu", 
        abstract: true,
        templateUrl: "templates/menu.html", // your index.html
        controller: 'SideMenuCtrl' // Controller name
    })

The index.html is not a template like how you create routes for other templates. That’s the problem

Can you try…
you can declare controller name in body tag…like-

and in controller.js-
.controller(‘testController’, function($scope) {
//Write your business logic

}

Thank you. I found a work around

1 Like

Can you please share your solution. I have the same problem.

Thanks,

Martin