Rails and Angular Routing

Question

So I have a rails app, with angular being slowly introduced. IM having an issue with rails routing and angular ui-route playing together nicely.

I have a order/index.html.erb that has

<div ng-app="orders"> 
  <div ui-view></div>
</div>

That ultimatley routes to a partials/orders/users/index.html file. Within that file I have a link to the edit page, that looks like this.<a ui-sref="users_orders_edit({userId: order.user.id, orderId: order.id})">Edit</a>

That link is being routed by angular to an edit page. Here is the issue. When I refresh the edit page with the url /users/:id/orders/:order_id/edit, it throws a rails error, saying that route is not defined.

What am I missing here?

I'm not familiar with Rails, but it's probably not a bad idea to set up your server-side routing to return your SPA for every html request. Then you can handle 404s via Angular router. That's a good start. Other solution would be to setup both your server side and client side routes to match. — Slava Fomin II
– Slava Fomin II, Commented Feb 13, 2016 at 22:43

Jimmy Baker · Accepted Answer · 2016-02-13 23:54:44Z

1

Here's what I do to solve this. In your routes.rb file add the following towards the bottom of the file so that it doesn't match every route:

get "/(*redirect_path)", to: "the_controller_that_serves_your_angular_app#index"

You don't have to call it redirect_path. It can be named whatever you like because you won't use it. This is telling rails to map all uncertain paths to your angular app. This will allow your users to refresh and it still load the angular app and even go to the correct state.

answered Feb 13, 2016 at 23:54

Jimmy Baker

3,2552 gold badges27 silver badges27 bronze badges

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

Collectives™ on Stack Overflow

Rails and Angular Routing

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related