javascript - Either issues with code, or issues with server with a angular.js routing issue -
i trying learn angular.js , incorporate routes within app. problem running have hit snag creating routes. have 2 similar pages, , keep hitting 404's when fire app in local host. feel close because being read, , have no errors within console, still have yet entire routes operate. grateful if take quick @ code below , see if there need alter fix.
i believe because of circumstances have 1 of 2 situations. either have issue code, or have issue server side routing. if code, hoping see if there issues , me out it. if problem server side routing, them have no idea do.
below app.js file. feel if there have made mistake with, one, i'm not entirely sure.
var app = angular.module('myapp', ['ngroute']); app.config(function ($routeprovider) { $routeprovider .when('/index/', { controller: 'maincontroller', templateurl: 'views/home.html' }) .when('/test/', { controller: 'testcontroller', templateurl: 'views/home.html' }) .otherwise({ redirectto: '/' }); });
these 2 html pages have within views. similar have different controllers associated them. first 1 called test, , second 1 called index
<div class="main" ng-controller="testcontroller"> <div class="container"> <h1>{{ title }}</h1> <div ng-repeat="product in products" class="col-md-6"> <product-info product="product"></product-info> </div> </div> </div> </div> <div class="main" ng-controller="maincontroller"> <div class="container"> <h1>{{ title }}</h1> <div ng-repeat="product in products" class="col-md-6"> <product-info product="product"></product-info> </div> </div> </div> </div>
finally, here general views index page:
<!doctype html> <html> <head> <link href="css/main.css" rel="stylesheet" /> <script src="js/shared/angular.min.js"></script> <script src="https://code.angularjs.org/1.2.28/angular-route.min.js"></script>" </head> <body ng-app="myapp"> <div class="header"> <div class="container"> <h1>stadiums in various leagues</h1> </div> </div> <div ng-view></div> <div class="footer"> <div class="container"> </div> <script src="js/app.js"></script> <script src="js/controllers/maincontroller.js"></script> <script src="js/directives/productinfo.js"></script> </body> </html>
Comments
Post a Comment