How can I include a different set of assets (CSS and JavaScript) for AngularJS views designed for phones and AngularJS views designed for desktop from a Rails API? The default template (application.html.erb or index.html) would typically only be loaded once, with the initial request, because it's an AngularJS application, so I do not think the usual desktop vs. mobile solutions for Rails apps will work.
Specifically, I am trying to combine a desktop app that uses AngularJS, Bootstrap, and jQuery with a mobile app that uses AngularJS and Ionic. The two apps will mostly have shared code, except for the views. The views will be very different, so a responsive approach will not be enough. I have not been able to find much guidance on this at all. Any help will be greatly appreciated.
Rails 4.1 offers variants so that you can have different view templates depending on the display type. Here's a more thorough example. It's really recent so there's not a lot out there about them yet.
If you're not on 4.1, you can look at using the Mobylette gem to achieve the same thing. You can then also have a completely different application.mobile.erb
that includes different assets.
For flipping between which assets you're including, you can also take a look at this (the helper method part), but this won't address the issue with different sets of views across the board:
Mobile style switching in Rails 3, helper method vs media queries