CODEWITHSUNDEEP
angularjs
pyprism
pyprism

Reputation: 3008

After naming ng-app breaks the code

My app works just fine without any ng-app name , when I name it angular don't work ! I am working with angular version 1.2.6 . Here is my code sample

index.html

<!doctype html>
<html ng-app="hiren">
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="dist/css/bootstrap.min.css"></head>
<body>
  <div class="container">
    <div class="row">
      <div class="center-block">
        <div id="sidebar-left" class="col-lg-2 col-2" >
          <ul class="nav bs-sidenav">
            <li>
              <a href="#/x">Home</a>
              <a href="/">Playlist</a>
              <a href="/">Browse</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-4 col-md-offset-4" >
        <div class="ng-view"></div>
      </div>
    </div>
  </div>
  <script src="dist/js/angular.min.js"></script>
  <script src="dist/js/angular-route.min.js"></script>
  <script src="dist/js/controler.js"></script>
</body>
</html>

controler.js

var hirenx = angular.module('hiren',[]);

hirenx.config(['$routeProvider' ,
    function($routeProvider){
        $routeProvider
        .when('/x' ,{
            templateUrl: 'x.html' ,
            controller : 'hireny'
        })
        .otherwise({
            redirectTo: '/'
        });
    }]);

hirenx.controller('hireny' , function($scope){
    $scope.message = "example" ;
});

Here is the sample partial . x.html

<h2>{{ message }}</h2>

Upvotes: 0

Views: 469

Answers (1)

KayakDave
KayakDave

Reputation: 24676

As of 1.2 you need to include ngRoute in your dependencies:

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

Upvotes: 3

Related Questions