简体   繁体   中英

script src not loading javascript for angular

HTML

    <!DOCTYPE html>
<html ng-app="dropApp">
<head>
    <meta charset="utf-8" />
    <title>DropBox</title>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
</head>
<body ng-controller="mainctrl">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script>


    <div class="jumbotron">
        <div class="container">
            <div class="col-sm-8 col-sm-offset-2">
                <a id="btn-login" ng-click="login()" ng-model="logbut" ng-show="logbut" class="btn btn-success">Login  </a>
                <div ng-include="template"></div>
            </div>
        </div>
    </div>
    <div class="credits text-center">
        <p>
            Amey Totawar
        </p>
    </div>
    <script src="angularsrc.js"></script>

</body>
</html>

Javascript File

var dropApp = angular.module("dropApp",[]);
var path = require('path');

dropApp.controller("mainctrl", function($scope) {
    $scope.logbut = true;
    $scope.login = function() {
        $scope.logbut = false;
        $scope.template = {
            name: 'login.html',
            url: path.join(__dirname,'views','login.html')
        };
    }
});

Getting Error: GET http://localhost:8600/angularsrc.js net::ERR_ABORTED and hence angular module not found. I tried including min.jquery earlier. I also tried changing angularsrc.js location, but nothing is working. Please help!!

<!DOCTYPE html>
<html ng-app="dropApp">
<head>
    <meta charset="utf-8" />
    <title>DropBox</title>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script>
    <script src="angularsrc.js"></script>
</head>
<body ng-controller="mainctrl">
    <div class="jumbotron">
        <div class="container">
            <div class="col-sm-8 col-sm-offset-2">
                <a id="btn-login" ng-click="login()" ng-model="logbut" ng-show="logbut" class="btn btn-success">Login  </a>
                <div ng-include="template"></div>
            </div>
        </div>
    </div>
    <div class="credits text-center">
        <p>
            Amey Totawar
        </p>
    </div>

</body>
</html>

and your js is same

var dropApp = angular.module("dropApp", []);
var path = require('path');

dropApp.controller("mainctrl", function ($scope) {
    $scope.logbut = true;
    $scope.login = function () {
        $scope.logbut = false;
        $scope.template = {
            name: 'login.html',
            url: path.join(__dirname, 'views', 'login.html')
        };
    }
});

This is what you exactly looking for

Your references should be inside head like

<html ng-app="dropApp">
<head>
    <meta charset="utf-8" />
    <title>DropBox</title>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script>
    <script src="angularsrc.js"></script>
</head>
<body ng-controller="mainctrl">
    {{your code or logic goes here}}
</body>
</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM