If you're working with an existing Rails application which you want to convert to Angular, you'll likely not get to keep a lot of the templating/view code from Rails. Instead, start clean by keeping your server-side APIs and statically serve up your Angular application. If you're starting with a clean rails app, keep in mind that it will basically be Rails' job to provide a JSON/XML API and to statically serve up the Angular app.
To change views in Angular without reloading the page, you'll want to use $routeProvider in coordination with ng-view. Register each of the routes in your application with their corresponding view template:
angular.module('user-manager', [])
.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html'
})
.when('/user/:id', {
templateUrl: 'views/user.html',
controller: 'UserCtrl'
})
.otherwise({
redirectTo: '/'
});
});
And then declare the ng-view somewhere in your main index.html:
<body ng-app="user-manager">
<!-- Main view -->
<div ng-view></div>
</body>
The ng-view will get replaced with the relevant template from your routes. For more details and a more complete example, see: http://docs.angularjs.org/api/ngRoute.$route