0

I can't for the life of me figure out what I'm doing wrong. I'm going off a John Linquist video doing some basic AngularJS routing. When I don't have my table in a partials folder and in my index.html page (and not using ng-view so I don't have to configure routing, it works fine. However, I try to inject my a partial view of my table with <ng-view></ng-view> then I get the error: http://goo.gl/nZAgrj (from the angular docs)

app.js

angular.module('enterprise',[])
    .config(function($routeProvider){
        $routeProvider.when("/",{templateUrl:"/partials/list.html"})
    })
//this is the that iterated over in the partial view's ng-repeat
function AppController($scope){
    $scope.crew =[
        {name:'Picard',description:'captain'},
        {name: 'Riker',description:'number 1'},
        {name:'Word',description:'Security'}
    ]
}

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Angular JS Routing</title>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"/>
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
</head>
<body>
<div ng-app="enterprise" ng-controller="AppController">
    <a href="/"><h2>Enterprise Crew</h2></a>
    <ng-view></ng-view>
     //list.html should be injected here
</div>

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>

list.html

<table class="table table-striped" style="width: 250px">
    <thead>
    <tr>
        <td>Name</td>
        <td>Description</td>
        <td><i class="glyphicon glyphicon-plus-sign"></i> </td>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="person in crew">
        <td>{{person.name}}</td>
        <td>{{person.description}}</td>
        <td><i class="glyphicon glyphicon-edit"></i></td>
    </tr>
    </tbody>
</table>
wootscootinboogie
  • 8,461
  • 33
  • 112
  • 197

2 Answers2

1

You need to include ng-route. 

 angular.module('myApp', ['ngRoute']).

cdn:

http://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.min.js

Nix
  • 57,072
  • 29
  • 149
  • 198
  • Well, thank you sir. I guess I found a version of angular that didn't have routing built in because in all of the tutorials I've seen they don't include it specifically, but this was it. – wootscootinboogie Jan 05 '14 at 20:34
  • They dont include it in the 1.2 versions. Its a common issue. – Nix Jan 05 '14 at 20:35
0

And is it working like that?

angular.module('enterprise',[])
.config(function($routeProvider){
    $routeProvider.when("/",{templateUrl:"/partials/list.html"})
})
.controller("AppController", ['$scope',
    function ($scope){
        $scope.crew =[
            {name:'Picard',description:'captain'},
            {name: 'Riker',description:'number 1'},
            {name:'Word',description:'Security'}
        ];
    }
 ]);

Ok, response is here : AngularJS 1.2 $injector:modulerr

Community
  • 1
  • 1
farvilain
  • 2,552
  • 2
  • 13
  • 24