I want to have nested routing in angular-
In User.html, i will have three sections add, edit ,delete.
On click of add it should route to user/add and redirected to add.html and same for others.
How can this be achieved?
You can use $anchorScroll but that will not change your url mean you will stay on the same page and it will just scroll you to the section. As i can understand you want to have different actions on the same page, there are many ways to do so like angular like ng-show and ng-hide. You you the user edit view on demand and so with the add user. You can use same form for add new and edit. there is a tutorial on Angular page if you scroll down there is a section Wire up a Backend and that's something you want in your application i guess :-)
Related
I build a website with many pages (event, blog, game....). One page display games (posts). User click on a new game button and there is a new post created.
User click on buttons to play, post is updated and reloaded.
I understand we can set wordpress to be a single application page with angularjs.
Is it possible to keep all the website as it is and use angularjs only for the game page, post ?
Absolutely, Just bootstrap ng-app to a wrapper of the section that has to be angularized or add ng-app to that wrapper. That way all the rest stays exactly the same.
Hi I want to include different html pages,
in my project there are 10 tiles clicking on 1 tile related html have to be included. like this if I click any one in 10 tiles particular page should be displayed. Any Solution for this
If you want to follow rest api, you should change the URL on click.
Now implement ng-view for including specific html in the view on the basis of url.
You can learn routing here :https://docs.angularjs.org/api/ngRoute
I have a view for which route has been defined. On the view I have a no of images and when I click any of them the Modal Dialog appears with the detail of that image. What I want to do is to change the url only when the modal appears so user can easily share them. And yes, the share url would be another route I will define so when user directly come to that one, the modal pops in. Any suggestion please?
I would not change the URL when a modal appears. A modal is an overlay of your page and actually not a new page with a new URL.
Many image hosters, however, show the URL in a read-only field under the picture so that users can copy it. Maybe this is the way you would like to go.
On the page itself I recommend using $location to determine if there is an imageId in your URL. If so, just invoke the same logic as if a user clicked on that image on the page.
We are building an application with complicated UI.
This is the sample view of a page in the application:
Left menu will contain the list of links for the corresponding pages in the right side.
We are using ng-router for building the application.
We took the whole page as one ng-view and include the left menu as single html template.
When clicking on the links, we will replace the right side tab content by ng-include.
Inside each right side content, we have sub tabs. When clicking on sub tab, we will replace the content of sub tab.
In Left menu template controller we have few ajax calls. When loading the content of the sub tab in right side, templates are not reloaded by the angular and is cached by the angular. But the ajax calls are reloaded again.
It should not reload the ajax calls inside the left menu when changing the content of sub tab in the right content.
Somebody might have faced this issue. Please suggest me to proceed further.
You definitely should check the ui-router project from the angular-ui team.
You will find their routing and the possibility to have nested views, named views and parameters super helpful with a complex design like yours.
https://github.com/angular-ui/ui-router
Alternatives to ui-router:
http://dotjem.github.io/angular-routing/
http://angular-route-segment.com/
Without diving into pros and cons.
Background:
I am using backbone.js & Twitter Bootstrap in my client-end page.
On clicking the logout button on header, a confirmation dialog should open.
The question is that
should I use router such as /logout to change to logoutView ?
If click No in the dialog, how could I show the main content with data before the dialog is opened.
Thanks!
Yes, you can use a router and you should.
First thing to know, is you have to render application's layout before dispatching any route, because the layout is rendered and needed for every action, so it's independant, right ?
Second you create a "logout" route in your router and give it the "#logout" hash, then in your "logout" action you open the modal.
Don't use router for such thing. Just fire the modal directly because:
On changing the router, you are gonna push that to the History. Hitting the browser's back button shouldn't really open a modal window.
URLs should be crafted in a way to be bookmarked. You don't want a URL that would open a popup or a modal window!
It's much simpler just to start the modal than to create a variable to hold the previous view and to fall back to it when clicking No
I have build client-side apps using different MVC frameworks like AngularJS and Backbone.js. Every time I faced the same situation you are talking about and found that the easiest and most accurate way is to just show the modal.
UPDATE
Please watch this. This is Jeremy Ashkenas the author of backbone.js stating exactly your situation about how should URLs be used and weather if they should be used to open a pop up or not.