?
Solved

Routing in AngularJS

Posted on 2014-02-11
2
Medium Priority
?
798 Views
Last Modified: 2014-02-12
Hi Experts,

I have following sample working code that uses angularjs routing on client side.Basically in reality I will have  vertical navigation bar with Add New order ,Show order and other menu items. Now what I want is if I select "Add New order" it should show  horizontal navigation bar  with "Add","Edit" and "Delete" tabs.

I am little bit confused where should I write routing details for "Add", "Edit" and Delet tabl for the  "Add New order" menu item using angularjs? I need sample working code for this.

Routing working example

THanks in Advance
0
Comment
Question by:ksd123
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 39852939
You can add the Angular UI router :
https://github.com/angular-ui/ui-router
One of the demo : http://plnkr.co/edit/u18KQc?p=preview

It's similar to routeProvider but you use a stateProvider instead.

I don't really like it(but I'm not god :), I prefer to use directive.
So in each oif your page add_order.html and show_order.html you can just add :
<horizontal-navigation><horizontal-navigation>

So you create a directive for this new HTML tag :

sampleApp.directive("horizontalNavigation", [function() {
	return {
		restrict:"E",
		link: function(scope, element, attrs) {
// code
		},
		templateUrl:"your-horizontal-bar.html" // the template
	};
}]);

Open in new window


anywhere you put the tag : <horizontal-navigation><horizontal-navigation>
it will be replaced by your cached template your-horizontal-bar.html
0
 

Author Closing Comment

by:ksd123
ID: 39855474
Thank you
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
Suggested Courses

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question