0

What is the best practice of changing pages in rails by using angularjs such that there will be no refresh? (I will use fadein animation on the switched page).

In addition to that, If I want to keep database query logic within Angularjs, so is there a way to read Rails url argument (foo.com/:arg) for Angularjs?

5
  • use router, use resource, read doc Commented Oct 19, 2013 at 8:23
  • i'd recommend not keeping query logic in client side code. too easy to hack Commented Oct 19, 2013 at 8:24
  • @FooL, thanks, so I think I went on a wrong path... Commented Oct 19, 2013 at 8:30
  • @FooL I dont understand your comment: even if you can read that js is picking info here and there, as long as server rules, its not a problem Commented Oct 19, 2013 at 8:41
  • @apneadiving That's correct. You can have a representation of the data you want from the server, but not the defining SQL/noSQL statements that will be sent to the db. Just practicing safe coding.. Commented Oct 20, 2013 at 13:05

1 Answer 1

1

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

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.