AngularJS impossible to use ng-repeat

Question

I'm becoming nuts with this issue... I have a node.js/express environment with the following files:

app/controllers.js

'use strict';

/* Controllers */

angular.module('myApp', [])
.controller('clientListCtrl', function($scope) {
    $scope.clients = [
        {'name': 'Dave'},
        {'name': 'Simon'}
];
});

and views/index.jade

doctype html
html(ng-app='myApp')
head
   link(rel='stylesheet' href='stylesheets/style.css')
   link(rel='stylesheet' href='bower_components/bootstrap/dist/css/bootstrap.css')
   script(type='text/javascript' src='javascripts/angular-1.2.16.min.js')

   script(type="application/javascript" src="app/controllers.js")
body
block content
p Welcome to Express
p 1 + 2 = {{ 1 + 2 }}

div(ng-controller="clientListCtrl")

ul
  li(ng-repeat="client in clients")
    span {{client.name}}

I get only the first part:

Welcome to Express

1 + 2 = 3

and not the names' list.

If you think I should add my server script, let me know and I'll add it.

Thanks in advance!

Answer 1

This is because your ul is not generated inside your div controller. I don't know jade, but I think that is a indentation problem. Try put a tab in your ul like that:

div(ng-controller="clientListCtrl")
  ul
    li(ng-repeat="client in clients")
      span {{client.name}}