Angular js index page loading issue

Question

Currently when I load login page, all controllers loading. therefore my system is slow. because I attached all controller files inside the index file. When loading login page i need stop to load unnecessary controllers (that controller need after the login). How I stop this., do i need to change my structure.

this is my index.html

<!DOCTYPE html>
<!--[if lt IE 7]>
<html lang="en" ng-app="cacm" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>
<html lang="en" ng-app="cacm" class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>
<html lang="en" ng-app="cacm" class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html lang="en" ng-app="cacm" class="no-js">
<!--<![endif]-->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
    <link rel="icon" href="/favicon.ico" type="image/x-icon">

    <link rel="stylesheet" href="lib/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="lib/datatables.net-bs/css/dataTables.bootstrap.min.css">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="lib/html5shiv/dist/html5shiv.min.js"></script>
    <script src="lib/respond.js/dest/respond.min.js"></script>
    <script>
        document.createElement('ui-select');
        document.createElement('ui-select-match');
        document.createElement('ui-select-choices');
    </script>
    <![endif]-->

    <!-- Font -->
    <link rel="stylesheet" href="fonts/fonts.css">

    <!-- Custom CSS -->
    <link rel="stylesheet" href="app.css">
</head>

<body class="hold-transition skin-purple fixed sidebar-mini">

    <div class="overlay" id="page-loading-spinner" style="background-color: #ecf0f5">
        <i class="fa fa-spinner fa-spin"
            style="font-size: 26px; position: absolute; top: calc(50% - 13px); left: calc(50% - 13px);"></i>
    </div>
    <script language="javascript" type="text/javascript">
        window.onload = function () {
            document.getElementById('page-loading-spinner').style.display = 'none';
        };
    </script>

    <div ui-view class="main"></div>

    <!-- js libraries -->
    <script src="lib/jquery/dist/jquery.min.js"></script>
    <script src="lib/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="lib/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="lib/datatables-light-columnfilter/dist/dataTables.lightColumnFilter.min.js"></script>
    <script src="lib/chart.js/dist/Chart.min.js"></script>
    <script src="lib/highlightjs/highlight.pack.min.js"></script>
    <script src="lib/chartjs-plugin-labels/build/chartjs-plugin-labels.min.js"></script>
    <script src="lib/jspdf/dist/jspdf.min.js"></script>
    <script src="lib/chartjs-plugin-empty-overlay/dist/chartjs-plugin-empty-overlay.min.js"></script>

    <!-- <script src="lib/datatables-light-columnfilter/distnew/dataTables.lightColumnFilter.min.js"></script> -->
    <script src="lib/datatables-light-columnfilter/distnew/dataTables.lcf.bootstrap3.min.js"></script>

    <!-- angular addons -->
    <script src="lib/angular-ui-select/dist/font-awesome.js"></script>
    <script src="lib/angular/angular.min.js"></script>
    <script src="lib/angular-animate/angular-animate.min.js"></script>
    <script src="lib/angular-ui-router/release/angular-ui-router.min.js"></script>
    <script src="lib/ngstorage/ngStorage.min.js"></script>
    <script src="lib/angular-sanitize/angular-sanitize.min.js"></script>
    <script src="lib/angular-auto-validate/dist/jcs-auto-validate.min.js"></script>
    <script src="lib/angular-datatables/dist/angular-datatables.min.js"></script>
    <script src="lib/angular-datatables/dist/plugins/buttons/angular-datatables.buttons.min.js"></script>
    <script src="lib/angular-datatables/dist/plugins/light-columnfilter/angular-datatables.light-columnfilter.min.js"></script>
    <script src="lib/angular-highlightjs/build/angular-highlightjs.min.js"></script>
 
 
    <!-- main app -->
    <script src="app.js"></script>

    <!-- login -->
    <script src="login.js"></script>

    <!-- modules -->
    <script src="modules/category-add/category-add.js"></script>
</body>

</html>

I need to stop project controllers, when loading login page

Anonymus · Accepted Answer · 2023-04-07 07:01:11Z

1

I think you must change the structure code.

I found the same question

here

answered Apr 7, 2023 at 7:01

Anonymus

1681 silver badge4 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular js index page loading issue

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related