angularjs - Angular Routing does not work -
my angular routing not working (clicking link not cause route change):
var smu72app = angular.module("smu72app", [ "ngroute" ]). config(function ($routeprovider, $locationprovider) { $routeprovider .when("/", { templateurl: "/templates/home.html", controller: 'smu72controller' }) .when("/objects", { templateurl: "/templates/objects.html", controller: 'smu72controller' }) .when("/object/:id", { templateurl: '/templates/object.html', controller: 'smu72controller' }) .otherwise({ redirectto: "/" }); $locationprovider.html5mode(true); });
that's main page hold ng-view (cutted bit better reading):
<!doctype html> <html ng-app="smu72app"> .... <base href="/"> ..... <body data-spy="scroll" data-target="#navbar" data-offset="0"> ... <div class="collapse navbar-collapse"> //that's scrollspy links (not angular) <ul class="nav navbar-nav"> <li class="active"><a href="/"><i class="fa fa-home" aria-hidden="true"></i></a></li> <li><a href="#services"> УСЛУГИ</a></li> <li><a href="#portfolio"> oБЪЕКТЫ</a></li> <li><a href="#about-us"> oТЗЫВЫ</a></li> <li><a href="#certificates"> СЕРТИФИКАТЫ</a></li> <li><a href="#contact"> КОНТАКТЫ</a></li> </ul> </div> </div> </div> <div ng-view></div> ... <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0msbjdehialfmubbqp6a4qrprq5ovfw37prr3j5elqxss1yvqotnepnhvp9aj7xs" crossorigin="anonymous"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> <script src="https://code.angularjs.org/1.5.3/angular-route.min.js"></script> <script src="https://code.angularjs.org/1.5.3/angular-resource.min.js"></script> <script src="scripts/simplbox.min.js"></script> <script src="http://localhost:25018/scripts/main.js"></script> <script src="http://localhost:25018/scripts/app.js"></script> <script src="http://localhost:25018/scripts/smu72controller.js"></script> </body> </html>
declare module first
angular.module("smu72app", ["ngroute"]);
then initialize config
angular.module("smu72app").config("....ur routes in here");
are getting console errors?
i have noticed 1 morething ur anchor tag href doesn't match routes in ur config section except ur home page , why ur home page loading fine.
just example try ur anchor tag <a href="#/about">
or <a href="/about">
coz think ur not using hash , create ur route below
$routeprovider.when('/about', { templateurl: 'partials/about.html', controller: 'aboutctrl' });
Comments
Post a Comment