How to disable routing in angularjs? - angularjs

I have a single page application that really just has one single page. There's just the one view that has lots of javascript/ajax logic done with angularjs, but there's no routing to other views involved.
Therefore I'd like to git rid of the hashbang (#/) at the end of the url. Can I somehow turn off angularjs routing completely?
Btw: I know about Htm5Mode, but I want it to work in all browsers.

If you don't have a $routeProvider defined, there will be no routing, and therefore no hash in your url.

Related

Is AngularJS Routing only used with ng-view?

As far as I understand, AngularJS routing configuration is required if you want to use ng-view for Single Page Application (SPA).
My question: if I am not building SPA, and I dont configure routing, can I still use $routeProvider to get URL parameters?
if you don't want any routing but you want parameters from the url. you could use the dependency, $routeparams. this might be a better solution then using the routeprovider since you don't want to have an actual spa.
No, you can inject the $stateProvier but you can't see any parameters if you don't register any state to navigate between pages.
example: http://embed.plnkr.co/9t3jwYxECN7GV8c3wDSl/

What is the difference between ngInclude and ngRoute

I was about to start using ngRoute because the ngRouter is all the talk here lately but I started realizing ngInclude is working fine for me and i'm wondering why everyone seems to be using ngRouter instead. They both load templates (or fragments) and I can attach a controller to either or. Is the only benefit to using ngRoute that you can use href to load a template? I don't mind using ng-click and changing a ngInclude value to true. Seems easier to me but i'm sure i'm missing something.
The point of using a router is to assign URLs to pages of your app. So that I can refresh the current page, or send a link to the current page to a friend, or bookmark the current page, and land on that page, instead of landing on the home page of the app.

What is the difference between $state.go(app.location) and $location.path("app/location")?

I have recently started using ionic framework, it has angular js in it. To navigate between screens, I was using $location.path and it's working great. However, in an example I've downloaded, I saw $state.go being used to redirect to some page. I would like to know the difference between the two.
The $location service is on the angular.js framework out of the box and allow you to manage location object (similar to that in pure javascript).
The $state service is a part of ui-router module and allows you to manage routes in an advanced mode, throughout a state machine management of views.
If you use ui-router, you should prefer to use $state service to manage states/routes because state abstracts the concept of route and you could change the physical routes without changing states.
Besides that, more problems you could have if you run in hashbang mode, in particular in your html links. In this case it's preferable to use ui-sref rather than ng-href (or just href).
In my opinion, you should always think in term of states rather than paths. Obviously you can mix the services if you know what you're doing
Thanks #wilver for answering it.
As I dug deeper into angular and learned different ways of structuring my projects, I got to understand these states and paths better. And yes, I've found states much better than paths.
$state.go, which comes with $stateProvider - a provider by ui-router, will work based on state names. Major difference between previously inbuilt(now you need to include ngRoute) router and states is that "States can have nested states but with router it's not possible. And I suddenly realized that whole of Ionic framework is possible because of this concept - I was able to understand this while working on an angular web app based on ngRoute and ionic app based on ui-router.
Ionic works with app as basic state and all other screens defined as its sub states. That's why you see app.screen1, app.screen2 inside $stateProvider in app.js.
So when you have routes, you use $location.path("<routeUrl>") and
when you have states, you use $state.go("<stateName>")
I use ionic and one of the differences that I have observed but not yet figured out why is that $location.path is much slower than $state.go

AngularJS $route service undesirable hash issue

I'm working on a big project. This project already has complicated structure. Most pages are generated on server-side with Twig.
Now we move the project to AngularJS.
It is not possible to use angular-way routing on whole project just now. But somewhere, it is necessary.
And here comes our trouble.
If I add 'ng-app' in html tag, for example, on some pages angular add hash in url.
And what is strange for me, that it's not everywhere.
On start page (project/profile9868766), url is clear as it is. But on some other (project/community/list), angular does something like that: project/community/list/#list .
And it is extremely undesirable.
There are no any angular routes, configured in $route service yet.
Please, help me to find out what causes that behavior, and what should i do to make all the things to go right way.
I want to add ng-app in html tag and not get any troubles with existing code, that may use hashes. And I want to use angular directives, controllers and other stuff, including $location service to set and track hashes on some pages. And later move everything to Angular and only after that start using Angular routes.
Thanks!
PS: English is not my native language, sorry about some weird constructions and mistakes. ))
Make sure to turn on html5mode
http://docs.angularjs.org/guide/dev_guide.services.$location
But the hash is inevitable on non-html5 browser.
The latest version of angular (v1.0.7) seems to have fixed this issue.

Keeping state when rendering page from the server side

I'm currently building a single page app using backbone.js
In order to keep all application pages accessible and crawl-able I made sure that the server side can also render the pages when accessing them directly.
The problem is as follows:
When pushState is not available it initiates the router using the current URL (e.g. if I accessed a url with http://example.com/example the router will build the hash fragment on top of that url)
So:
Is there any way of handling this (besides redirecting the use)
If you are redirecting as soon as the JS (using pushState feature detection) you still have a problem of urls not having hash signs.
Generally asking, is there a better approach of designing this kind of application?
Thanks!
I think the evolving consensus is pushstate or nothing (ie to degrade web 1.0 and drop hash-bang routing all together) if SEO-friendly browsing matters to you.
Its one of the reasons I don't use Backbone.js and just use PJAX is that pushstate and DOM rendering times are so good you can be single page with very little JS and hash-bang routing has always been rather hackish.
Thus an option is to not use Backbone's router all together and just let something like PJAX (or DJAX or something similar) do the routing work and let Backbone just do the inner page event/rendering stuff (ie validating forms, modal windows, etc..).

Resources