Routing in AngularJS

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
ksd123Asked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
leakim971Connect With a Mentor PluritechnicianCommented:
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
 
ksd123Author Commented:
Thank you
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.