{"id":219,"date":"2017-03-22T11:58:24","date_gmt":"2017-03-22T11:58:24","guid":{"rendered":"http:\/\/codeinsightacademy.com\/blog\/?p=219"},"modified":"2017-05-12T05:20:56","modified_gmt":"2017-05-12T05:20:56","slug":"routing-without-hashtag","status":"publish","type":"post","link":"https:\/\/codeinsightacademy.com\/blog\/angular-js\/routing-without-hashtag\/","title":{"rendered":"Routing without hashtag"},"content":{"rendered":"<p>&nbsp;<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;DOCTYPE html&gt;\r\n&lt;html&gt;\r\n    &lt;head&gt;\r\n        &lt;meta CHARSET=\"UTF-8\"&gt;\r\n        &lt;base href=\"\/\"&gt;\r\n        &lt;script src=\"http:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.4.8\/angular.min.js\"&gt;&lt;\/script&gt;\r\n        &lt;script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.4.8\/angular-route.js\"&gt;&lt;\/script&gt;\r\n    &lt;\/head&gt;\r\n    &lt;body ng-app=\"myApp\"&gt;\r\n        &lt;aside&gt;\r\n            &lt;a href=\"testlab\/angular\/sample\/26_routing_without_hashing.html\"&gt;Home&lt;\/a&gt;\r\n            &lt;a href=\"red\"&gt;Red&lt;\/a&gt;\r\n            &lt;a href=\"green\"&gt;Green&lt;\/a&gt;\r\n            &lt;a href=\"blue\"&gt;Blue&lt;\/a&gt;\r\n            &lt;a href=\"default\"&gt;Default&lt;\/a&gt;\r\n        &lt;\/aside&gt;\r\n        &lt;section ng-view&gt;&lt;\/section&gt;\r\n    &lt;\/body&gt;\r\n    &lt;script&gt;\r\n        var app = angular.module(\"myApp\", [\"ngRoute\"]);\r\n        app.config(function ($routeProvider, $locationProvider) {\r\n            $routeProvider\r\n                    .when(\"\/red\", {\r\n                        template: \"&lt;h2 style='color:red;'&gt;Red Color&lt;\/h2&gt;\"\r\n                                \/*\r\n                                 templateUrl : \"red.html\",\r\n                                 controller : \"myCtrl\"\r\n                                 *\/\r\n                    })\r\n                    .when(\"\/green\", {\r\n                        template: \"&lt;h2 style='color:green;'&gt;Green Color&lt;\/h2&gt;\"\r\n                    })\r\n                    .when(\"\/blue\", {\r\n                        template: \"&lt;h2 style='color:blue;'&gt;Blue Color&lt;\/h2&gt;\"\r\n                    })\r\n                    .otherwise({\r\n                        template: \"&lt;h2&gt;Default Black Color&lt;\/h2&gt;\"\r\n                    });\r\n\r\n            $locationProvider.html5Mode(true);\r\n        });\r\n    &lt;\/script&gt;\r\n&lt;\/html&gt;<\/pre>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; &lt;DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta CHARSET=&#8221;UTF-8&#8243;&gt; &lt;base href=&#8221;\/&#8221;&gt; &lt;script src=&#8221;http:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.4.8\/angular.min.js&#8221;&gt;&lt;\/script&gt; &lt;script src=&#8221;https:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.4.8\/angular-route.js&#8221;&gt;&lt;\/script&gt; &lt;\/head&gt; &lt;body ng-app=&#8221;myApp&#8221;&gt; &lt;aside&gt; &lt;a href=&#8221;testlab\/angular\/sample\/26_routing_without_hashing.html&#8221;&gt;Home&lt;\/a&gt; &lt;a href=&#8221;red&#8221;&gt;Red&lt;\/a&gt; &lt;a href=&#8221;green&#8221;&gt;Green&lt;\/a&gt; &lt;a href=&#8221;blue&#8221;&gt;Blue&lt;\/a&gt; &lt;a href=&#8221;default&#8221;&gt;Default&lt;\/a&gt; &lt;\/aside&gt; &lt;section ng-view&gt;&lt;\/section&gt; &lt;\/body&gt; &lt;script&gt; var app = angular.module(&#8220;myApp&#8221;, [&#8220;ngRoute&#8221;]); app.config(function ($routeProvider, $locationProvider) { $routeProvider .when(&#8220;\/red&#8221;, { template: &#8220;&lt;h2 style=&#8217;color:red;&#8217;&gt;Red Color&lt;\/h2&gt;&#8221; \/* templateUrl : &#8220;red.html&#8221;, controller : &#8220;myCtrl&#8221; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"quote","meta":[],"categories":[6],"tags":[],"_links":{"self":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/219"}],"collection":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/comments?post=219"}],"version-history":[{"count":2,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/219\/revisions"}],"predecessor-version":[{"id":256,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/219\/revisions\/256"}],"wp:attachment":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/media?parent=219"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/categories?post=219"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/tags?post=219"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}