javascript - Angular.js making repeated requests and never loading -
i'm in process of learning angular.js, have simple node app serving basic angular web page , writing simple log data stdout. until now, has worked fine, now, no known reason, every time try load page, page doesn't load (and crashes) , until forced memory issues kill it, happens in node app:
my-imac:learning angular.js me$ node node-app.js incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846525840 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846525840 incoming request /libs/angular.min.js?_=1443846526063 loaded page /libs/angular.min.js?_=1443846526063 incoming request /libs/angular-route.min.js?_=1443846526340 loaded page /libs/angular-route.min.js?_=1443846526340 incoming request /js/3.js?_=1443846526389 loaded page /js/3.js?_=1443846526389 incoming request /libs/jquery.min.js?_=1443846526398 loaded page /libs/jquery.min.js?_=1443846526398 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846526637 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846526637 incoming request /libs/angular.min.js?_=1443846526645 loaded page /libs/angular.min.js?_=1443846526645 incoming request /libs/angular-route.min.js?_=1443846526693 loaded page /libs/angular-route.min.js?_=1443846526693 incoming request /js/3.js?_=1443846526698 loaded page /js/3.js?_=1443846526698 incoming request /libs/jquery.min.js?_=1443846526739 loaded page /libs/jquery.min.js?_=1443846526739 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846526751 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846526751 incoming request /libs/angular.min.js?_=1443846526758 loaded page /libs/angular.min.js?_=1443846526758 incoming request /libs/angular-route.min.js?_=1443846526789 loaded page /libs/angular-route.min.js?_=1443846526789 incoming request /js/3.js?_=1443846526795 loaded page /js/3.js?_=1443846526795 incoming request /libs/jquery.min.js?_=1443846526802 loaded page /libs/jquery.min.js?_=1443846526802 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846527180 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846527180 incoming request /libs/angular.min.js?_=1443846527190 loaded page /libs/angular.min.js?_=1443846527190 incoming request /libs/angular-route.min.js?_=1443846527220 loaded page /libs/angular-route.min.js?_=1443846527220 incoming request /js/3.js?_=1443846527225 loaded page /js/3.js?_=1443846527225 incoming request /libs/jquery.min.js?_=1443846527235 loaded page /libs/jquery.min.js?_=1443846527235 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846527246 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846527246 incoming request /libs/angular.min.js?_=1443846527254 loaded page /libs/angular.min.js?_=1443846527254 incoming request /libs/angular-route.min.js?_=1443846527266 loaded page /libs/angular-route.min.js?_=1443846527266 incoming request /js/3.js?_=1443846527281 loaded page /js/3.js?_=1443846527281 incoming request /libs/jquery.min.js?_=1443846527340 loaded page /libs/jquery.min.js?_=1443846527340 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846527363 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846527363 incoming request /libs/angular.min.js?_=1443846527935 loaded page /libs/angular.min.js?_=1443846527935 incoming request /libs/angular-route.min.js?_=1443846527957 loaded page /libs/angular-route.min.js?_=1443846527957 incoming request /js/3.js?_=1443846527963 loaded page /js/3.js?_=1443846527963 incoming request /libs/jquery.min.js?_=1443846527973 loaded page /libs/jquery.min.js?_=1443846527973 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846528005 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846528005 incoming request /libs/angular.min.js?_=1443846528019 loaded page /libs/angular.min.js?_=1443846528019 incoming request /libs/angular-route.min.js?_=1443846528031 loaded page /libs/angular-route.min.js?_=1443846528031 incoming request /js/3.js?_=1443846528035 loaded page /js/3.js?_=1443846528035 incoming request /libs/jquery.min.js?_=1443846528043 loaded page /libs/jquery.min.js?_=1443846528043 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846528056 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846528056 incoming request /libs/angular.min.js?_=1443846528065 loaded page /libs/angular.min.js?_=1443846528065 incoming request /libs/angular-route.min.js?_=1443846528141 loaded page /libs/angular-route.min.js?_=1443846528141 incoming request /js/3.js?_=1443846528496 loaded page /js/3.js?_=1443846528496 incoming request /libs/jquery.min.js?_=1443846528520 loaded page /libs/jquery.min.js?_=1443846528520 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846528546 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846528546 incoming request /libs/angular.min.js?_=1443846528553 loaded page /libs/angular.min.js?_=1443846528553 incoming request /libs/angular-route.min.js?_=1443846528564 loaded page /libs/angular-route.min.js?_=1443846528564 incoming request /js/3.js?_=1443846528605 loaded page /js/3.js?_=1443846528605 incoming request /libs/jquery.min.js?_=1443846528643 loaded page /libs/jquery.min.js?_=1443846528643 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846528656 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846528656 incoming request /libs/angular.min.js?_=1443846528679 loaded page /libs/angular.min.js?_=1443846528679 incoming request /libs/angular-route.min.js?_=1443846528694 loaded page /libs/angular-route.min.js?_=1443846528694 incoming request /js/3.js?_=1443846528700 loaded page /js/3.js?_=1443846528700 incoming request /libs/jquery.min.js?_=1443846528708 loaded page /libs/jquery.min.js?_=1443846528708 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846528726 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846528726 incoming request /libs/angular.min.js?_=1443846529054 loaded page /libs/angular.min.js?_=1443846529054 incoming request /libs/angular-route.min.js?_=1443846529083 loaded page /libs/angular-route.min.js?_=1443846529083 incoming request /js/3.js?_=1443846529088 loaded page /js/3.js?_=1443846529088 incoming request /libs/jquery.min.js?_=1443846529096 loaded page /libs/jquery.min.js?_=1443846529096 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846529128 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846529128 incoming request /libs/angular.min.js?_=1443846529331 loaded page /libs/angular.min.js?_=1443846529331 incoming request /libs/angular-route.min.js?_=1443846529354 loaded page /libs/angular-route.min.js?_=1443846529354 incoming request /js/3.js?_=1443846529657 loaded page /js/3.js?_=1443846529657 incoming request /libs/jquery.min.js?_=1443846529679 loaded page /libs/jquery.min.js?_=1443846529679 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846529694 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846529694 incoming request /libs/angular.min.js?_=1443846529728 loaded page /libs/angular.min.js?_=1443846529728 incoming request /libs/angular-route.min.js?_=1443846529740 loaded page /libs/angular-route.min.js?_=1443846529740 incoming request /js/3.js?_=1443846529744 loaded page /js/3.js?_=1443846529744 incoming request /libs/jquery.min.js?_=1443846529751 loaded page /libs/jquery.min.js?_=1443846529751 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846529764 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846529764 incoming request /libs/angular.min.js?_=1443846529795 loaded page /libs/angular.min.js?_=1443846529795 incoming request /libs/angular-route.min.js?_=1443846529902 loaded page /libs/angular-route.min.js?_=1443846529902 incoming request /js/3.js?_=1443846529943 loaded page /js/3.js?_=1443846529943 incoming request /libs/jquery.min.js?_=1443846529950 loaded page /libs/jquery.min.js?_=1443846529950 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846529967 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846529967 incoming request /libs/angular.min.js?_=1443846530108 loaded page /libs/angular.min.js?_=1443846530108 incoming request /libs/angular-route.min.js?_=1443846530137 loaded page /libs/angular-route.min.js?_=1443846530137 incoming request /js/3.js?_=1443846530144 loaded page /js/3.js?_=1443846530144 incoming request /libs/jquery.min.js?_=1443846530153 loaded page /libs/jquery.min.js?_=1443846530153 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846530165 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846530165 incoming request /libs/angular.min.js?_=1443846530173 loaded page /libs/angular.min.js?_=1443846530173 incoming request /libs/angular-route.min.js?_=1443846530189 loaded page /libs/angular-route.min.js?_=1443846530189 incoming request /js/3.js?_=1443846530196 loaded page /js/3.js?_=1443846530196 incoming request /libs/jquery.min.js?_=1443846530204 loaded page /libs/jquery.min.js?_=1443846530204 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846530611 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846530611 incoming request /libs/angular.min.js?_=1443846530844 loaded page /libs/angular.min.js?_=1443846530844 incoming request /libs/angular-route.min.js?_=1443846530857 loaded page /libs/angular-route.min.js?_=1443846530857 incoming request /js/3.js?_=1443846530862 loaded page /js/3.js?_=1443846530862 incoming request /libs/jquery.min.js?_=1443846530898 loaded page /libs/jquery.min.js?_=1443846530898 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846530909 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846530909 incoming request /libs/angular.min.js?_=1443846531006 loaded page /libs/angular.min.js?_=1443846531006 incoming request /libs/angular-route.min.js?_=1443846531021 loaded page /libs/angular-route.min.js?_=1443846531021 incoming request /js/3.js?_=1443846531140 loaded page /js/3.js?_=1443846531140 incoming request /libs/jquery.min.js?_=1443846531146 loaded page /libs/jquery.min.js?_=1443846531146 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846531501 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846531501 incoming request /libs/angular.min.js?_=1443846531520 loaded page /libs/angular.min.js?_=1443846531520 incoming request /libs/angular-route.min.js?_=1443846531680 loaded page /libs/angular-route.min.js?_=1443846531680 incoming request /js/3.js?_=1443846532119 loaded page /js/3.js?_=1443846532119 incoming request /libs/jquery.min.js?_=1443846532128 loaded page /libs/jquery.min.js?_=1443846532128 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846532161 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846532161 incoming request /libs/angular.min.js?_=1443846532359 loaded page /libs/angular.min.js?_=1443846532359 incoming request /libs/angular-route.min.js?_=1443846532386 loaded page /libs/angular-route.min.js?_=1443846532386 incoming request /js/3.js?_=1443846532396 loaded page /js/3.js?_=1443846532396 incoming request /libs/jquery.min.js?_=1443846532414 loaded page /libs/jquery.min.js?_=1443846532414 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846532619 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846532619 incoming request /libs/angular.min.js?_=1443846532634 loaded page /libs/angular.min.js?_=1443846532634 incoming request /libs/angular-route.min.js?_=1443846533444 loaded page /libs/angular-route.min.js?_=1443846533444 incoming request /js/3.js?_=1443846533472 loaded page /js/3.js?_=1443846533472 incoming request /libs/jquery.min.js?_=1443846533480 loaded page /libs/jquery.min.js?_=1443846533480 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846534037 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846534037 incoming request /libs/angular.min.js?_=1443846534046 loaded page /libs/angular.min.js?_=1443846534046 incoming request /libs/angular-route.min.js?_=1443846534058 loaded page /libs/angular-route.min.js?_=1443846534058 incoming request /js/3.js?_=1443846534191 loaded page /js/3.js?_=1443846534191 incoming request /libs/jquery.min.js?_=1443846534253 loaded page /libs/jquery.min.js?_=1443846534253 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846534282 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846534282 incoming request /libs/angular.min.js?_=1443846534298 loaded page /libs/angular.min.js?_=1443846534298 incoming request /libs/angular-route.min.js?_=1443846534343 loaded page /libs/angular-route.min.js?_=1443846534343 incoming request /js/3.js?_=1443846534349 loaded page /js/3.js?_=1443846534349 incoming request /libs/jquery.min.js?_=1443846534362 loaded page /libs/jquery.min.js?_=1443846534362 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846534377 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846534377 incoming request /libs/angular.min.js?_=1443846534385 loaded page /libs/angular.min.js?_=1443846534385 incoming request /libs/angular-route.min.js?_=1443846534401 loaded page /libs/angular-route.min.js?_=1443846534401 incoming request /js/3.js?_=1443846534409 loaded page /js/3.js?_=1443846534409 incoming request /libs/jquery.min.js?_=1443846534416 loaded page /libs/jquery.min.js?_=1443846534416 incoming request /libs/bootstrap/js/bootstrap.min.js?_=1443846534427 loaded page /libs/bootstrap/js/bootstrap.min.js?_=1443846534427 here code angular:
var app = angular.module('app', ['ngroute']); app.config(['$routeprovider', function($routeprovider) { $routeprovider .when('/', { controller: 'maincontroller', templateurl: './main6.html' }) .when('/company', { controller: 'companycontroller', templateurl: './company6.html' }) .otherwise({ redirectto: '/' }); }]); app.controller('maincontroller', function($scope) { $scope.companies = [{ heading: 'text1', content: 'donec id elit non mi porta gravida @ eget metus. fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. etiam porta sem malesuada magna mollis euismod. donec sed odio dui. ' }, { heading: 'text2', content: 'donec id elit non mi porta gravida @ eget metus. fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. etiam porta sem malesuada magna mollis euismod. donec sed odio dui. ' }, { heading: 'some3', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. vivamus dapibus egestas mauris. etiam blandit turpis sapien pretium condimentum. duis dapibus arcu ac tellus euismod, non feugiat est vulputate. cras nec sodales felis. sed ac massa lacus. nunc in tellus ante fermentum consectetur @ nulla. cras nec egestas. ' }, { heading: 'pickles', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi erat augue, tristique sollicitudin nec, rhoncus et nisi. aenean @ mi ex. sed tincidunt euismod porttitor. quisque varius elit in efficitur placerat. morbi quis turpis facilisis, congue purus ut, vehicula felis. nam ex nulla, pellentesque vitae ipsum eget, tincidunt luctus.' }, { heading: 'dill', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi erat augue, tristique sollicitudin nec, rhoncus et nisi. aenean @ mi ex. sed tincidunt euismod porttitor. quisque varius elit in efficitur placerat. morbi quis turpis facilisis, congue purus ut, vehicula felis. nam ex nulla, pellentesque vitae ipsum eget, tincidunt luctus.' }]; }); app.controller('companycontroller', function($scope) { $scope.companies = [{ heading: 'text1', content: 'donec id elit non mi porta gravida @ eget metus. fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. etiam porta sem malesuada magna mollis euismod. donec sed odio dui. ' }, { heading: 'text2', content: 'donec id elit non mi porta gravida @ eget metus. fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. etiam porta sem malesuada magna mollis euismod. donec sed odio dui. ' }, { heading: 'some3', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. vivamus dapibus egestas mauris. etiam blandit turpis sapien pretium condimentum. duis dapibus arcu ac tellus euismod, non feugiat est vulputate. cras nec sodales felis. sed ac massa lacus. nunc in tellus ante fermentum consectetur @ nulla. cras nec egestas. ' }, { heading: 'pickles', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi erat augue, tristique sollicitudin nec, rhoncus et nisi. aenean @ mi ex. sed tincidunt euismod porttitor. quisque varius elit in efficitur placerat. morbi quis turpis facilisis, congue purus ut, vehicula felis. nam ex nulla, pellentesque vitae ipsum eget, tincidunt luctus.' }, { heading: 'dill', content: 'lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi erat augue, tristique sollicitudin nec, rhoncus et nisi. aenean @ mi ex. sed tincidunt euismod porttitor. quisque varius elit in efficitur placerat. morbi quis turpis facilisis, congue purus ut, vehicula felis. nam ex nulla, pellentesque vitae ipsum eget, tincidunt luctus.' }]; }); why angular app making continuous requests , re-requests files, instead of loading , behaving normally? if helps, problem began when tinkering routing.
update 1:
when change this:
.when('/company', { controller: 'companycontroller', templateurl: './company6.html' }) to this:
.when('/company', { controller: 'companycontroller', templateurl: './main6.html' }) no more requests come server, , "/company" loads same page "/". makes page rather useless, if every url can load same template, information may helpful. of note "main6.html" , "company6.html" identical, except changed text.
update 2:
i've figured out whenever use ./main6.html template url works, when use ./company6.html, doesn't. means issue isolated loading /company page, , / page loads fine. i've checked typos in company6.html, misspellings of file name, errors in html, html identical of main6.html, few differences in text.
update 3:
here code main6.html (company6.html has different lorem ipsum, otherwise same):
<nav class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="/">nyse companies</a> </div> <div id="navbar" class="navbar-collapse collapse"> <form class="navbar-form navbar-right"> <div class="form-group"> <input type="text" placeholder="email" class="form-control"> </div> <div class="form-group"> <input type="password" placeholder="password" class="form-control"> </div> <button type="submit" class="btn btn-success">sign in</button> </form> </div> </div> </nav> <div class="jumbotron"> <div class="container"> <h1>lorem ipsum dolor sit amet</h1> <p>quisque ultrices libero quis fringilla tempor. ut egestas sapien posuere lorem eleifend bibendum. duis et pellentesque ex, id scelerisque urna. nullam ullamcorper molestie urna, eget lobortis eros finibus eu. donec vulputate nisi. quisque eget ullamcorper nulla.</p> </div> </div> <div class="container"> <div class="input-group"> <span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></span> <input type="text" class="form-control" placeholder="company" aria-describedby="basic-addon1" data-ng-model="search"> </div> <div class="row"> <div class="col-md-4" data-ng-repeat="company in companies | filter: search"> <h2>{{company.heading | uppercase}}</h2> <p>{{company.content}}</p> <p><a class="btn btn-default" href="#/company" role="button">view details »</a></p> </div> </div> <hr> <footer> <p>wibbly wobbly timey wimey</p> </footer> </div> here code 6.html, actual main page loads angular, , contains templates:
<!doctype html> <html lang="en" data-ng-app="app"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta charset="utf-8"> <title>lipsum dipsum</title> <link href="./libs/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <style> body { padding-top: 50px; padding-bottom: 20px; } </style> <script> </script> </head> <body> <div data-ng-view></div> <script type="text/javascript" src="./libs/jquery.min.js"></script> <script type="text/javascript" src="./libs/bootstrap/js/bootstrap.min.js"></script> <script type="text/javascript" src="./libs/angular.min.js"></script> <script type="text/javascript" src="./libs/angular-route.min.js"></script> <script type="text/javascript" src="./js/3.js"></script> </body> </html>
i've encountered issue in past single page applications. check make sure of templateurls point existing file paths.
my node single page application server default serving index.html file whenever serve 404 page. so, when directive had templateurl did not exist, server serve index.html in place. script tags inside of index.html subsequently loaded , whole process repeat.
my best suggestion debugging issue visit each templateurl independently in browser.
Comments
Post a Comment