angularjs nested routing doesn't load layout

You don't actually have nested states; you simply have a primary index.html file that serves as the container for your application, its dependencies, and your views. Angular won't load your primary index.html page, the index.html page loads Angular.

So there is no need for your 'home' state to have a templateUrl. You will use nested states if, for example, your dashboard view has an inner view that can load different templates depending on a user action. See Angular UI Router's documentation for some example use cases for nested views.

You can't declare index.html as your firststate like @jakeblues said.

Try to put all the specific content from index.html in a new template :

.state('home', {
      url: '/',
      templateUrl: 'home.html',
      controller: 'homeCtrl'
 })
.state('dashboard', {
      url: '/dashboard',
      templateUrl: 'dashboard/index.html',
      controller: 'dashboardCtrl'
 })

I downloaded your code from the repo.

The main problem I am seeing is that your angular code is not being loaded when you do example.com/dashboard

app.use(express.static(path.join(__dirname, 'public')));

This makes your public folder as the folder from which the project is being loaded.

When you do example.com, Your angular code is loaded because you are responded with public/index.html file which contains angular code and it is correct.

But when you do example.com/dashboard, it is actually loading html file /public/dashboard/index.html where there is no any angular code.

Try doing alert on dashboardCtrl.js. You will get nothing because it is not being loaded. It is only included in index.html file which is not loaded at all.

Try changeing url to dashboards and remove 'home.dashboard'

.state('dashboard', {
  url: '/dashboards',
  templateUrl: 'dashboard/index.html',
  controller: 'dashboardCtrl'
 })