AngularJS route does not render the template

Question

I have two controllers and I'm using the AngularJS $routeProvider to load multiple pages. When I click on the link from the first partial to go the second one, the second partial does not render, and the template tags are all that show.

So, in the first partial, this renders to Hello World:

<h1>Hello {{name}}</h1>

But, this doesn't render on the second partial:

<h1>Hello {{name}} on page 2</h1>

Here's a plunkr to show what I mean: http://plnkr.co/edit/7X2vlIhMvLlIqE4UvC09?p=preview

Answer 1

You are not injecting $routeParams to your controller. Inject it to your controller like:

app.controller("UserDetailCtrl", function($scope, $routeParams) {

This will solve your issue

In your controller you named the scope variable as $scope.name2 and in your partial2.html page you are binding to {{name}}. That is the problem. Change it to {{name2}} or either change your scope variable to $scope.name