0

i am new on angularjs. I have done all regarding routing but its not working. I want my home page will be the default page. Whenever i open index.php page, it shows black screen. Here is my code,

//index.php
<body ng-app="app">
        <!-- HEADER AND NAVBAR -->
        <header>
            <nav class="navbar navbar-default">
                <div class="container">
                    <div class="navbar-header">
                        <a class="navbar-brand" href="/angularjs">Angular JS Practice</a>
                    </div>

                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#home"><i class="fa fa-home"></i> Home</a></li>
                        <li><a href="#students"><i class="fa fa-shield"></i> Student</a></li>
                    </ul>
                </div>
            </nav>
        </header>

        <div class="container-fluid">
            <div ng-view></div>

            <script type = "text/ng-template" id = "home.htm">
                <h2> {{pagename}} </h2>
                {{message}}
            </script>

            <script type = "text/ng-template" id = "students.htm">
                <h2> {{pagename}} </h2>
                {{message}}
            </script>

        </div>
        <!--1.4.8-->
        <script src="js/angular.min.js"></script>
        <script src="js/angular-route.js"></script>  
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/app.js"></script>
    </body>

App.js

var app=angular.module('app',['ngRoute']);


app.config(['$routeProvider',function($routeProvider){
    $routeProvider.when("/",{
        templeteUrl:"home.htm",
        controller:'myctrl'
    }).when("/students",{
        templateUrl:"students.htm",
        controller:"studentCtrl"
    }).otherwise({
        templateUrl:"404.php",
        controller:"notfoundCtrl"
    })

}]);

app.controller("notfoundCtrl",function($scope){
    $scope.pagename='Not Found';
    $scope.message='The page you are request not found';

});

app.controller("studentCtrl",function($scope){
    $scope.pagename='Students';
    $scope.message="This is student page"; 
});

app.controller("myctrl",function($scope){
   $scope.pagename="Home Page";
   $scope.message="This is home page";
});
9
  • What's the problem? Be more accurate, what happens when you try to navigate? How do you navigate? What Url's do you use? ... Commented May 12, 2016 at 7:17
  • Edited my question. By default it shows black screen. It should show home page content Commented May 12, 2016 at 7:18
  • What kind of errors do you see in the console. Are you able to navigate to other pages? Commented May 12, 2016 at 7:23
  • @WildWidow no console error. Yes students link is working fine. Commented May 12, 2016 at 7:24
  • 4
    You have templeteUrl instead of templateUrl.? Commented May 12, 2016 at 7:25

2 Answers 2

5

You wrote templeteUrl:"home.htm", can you try changing that to templateUrl:"home.htm"?

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

Comments

0

you have a syntax error :templateUrl instead of templeteUrl

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.