In this video we'll discuss 2 simple and useful features in Angular
- Caseinsensitivematch
- Inline Templates
Let us understand these 2 features with examples.
Caseinsensitivematch: The routes that is configured using config function is case sensitive by default. Consider the route below. Notice the route (/home) is a lower case.
$routeProvider. When ("Home", {templateurl: "templates/home.html", Controller: "HomeController", Controlleras: "Homectrl",})
If we type the following URL in the browser, we'll see home.html as expected.
Http://localhost:51983/home
If you type the following URL, the you'll see a blank layout page. This was because, by default routes was case-sensitive
Http://localhost:51983/HOME
The route case-insensitive set Caseinsensitivematch property to True as shown below.
$routeProvider. When ("Home", {templateurl: "templates/home.html", Controller: "HomeController", Controlleras: "Homectrl", caseinsensitivematch:true})
To do all routes case-insensitive set Caseinsensitivematch property on $routeProvider as shown below.
$routeProvider. Caseinsensitivematch = true;
Inline Templates: The view content for the route (/home), is coming from a separate HTML file (home.html)
$routeProvider. When ("Home", {templateurl: "templates/home.html", Controller: "HomeController", Controlleras: "Homectrl",})
Should the view content always come from a separate HTML file. Not necessarily. You can also with an inline template. Use the an inline template with the template property as shown below.
$routeProvider. When ("Home", {Template: "
At the navigate to Http://localhost:51983/home, you should see the Inline Template in action.
Part AngularJS Caseinsensitivematch and Inline Templates