What is View Engine?
View Engine is responsible for producing an HTML response when called by the Controller Action method.The Controller Action methods can return different types of responseswhich are collectively called as Action Results. The View-result is the Action Result which produces the HTML Response.
The View Results are produced by the View Engine. When the Controller Action method call the view () or PartialView ()it calls the View Engine, which generate the HTML Response.View Engine is responsible for rendering the view into HTML form to the browser, View Engine is used to convert HTMLProgramming language to pure HTML.
Why is View Engine required in ASP.NET?
- View engine is responsible in creating HTML for View.
- It converts Pure HTML programming language to HTML
- View Engine is used to find the Related view for the action method.
- We are able to write C#/VB code on View
- View Engine is Needed to implement the strongly-typed View.
What is Razor View Engine?
The Razor View Engine is the default View Engine for the ASP.NET Core. It looks for Razor markup in the View File and parses it and produces the HTML response.
Razor Markup
The Controller in MVC invokes the View by passing the info to render. The Views must have the power to process the info and generate a response. This is done by the Razor markup, which allows us to use C# code in an HTML file. The Razor View Engine process these markups to get the HTML.
The files which contains Razor markup have a. cshtml file extension.The Razor syntax is shorter, simpler and straightforward to find out because it uses the C# or visual basic. The Visual Studio Intelligence support also helps with Razor syntax.
What is Razor Syntax in MVC?
There aretwo types of Razor syntax.
- Single statement block: It starts with @.
- Multi statement block: It is starts with @ {Coding part}.
It needs to be always enclosed in @ {Coding part}
The semicolon “;” must be used to end the statements
Inline expressions (variables and functions) start with @
Read More: How To Use Elmah For Enumerating Error In Asp.net Core?
1) Single block Statements
A single statement block is used when a single line of code needs to write on View.
Example
To display current Date-time.
Create Index.cshtml View and add below code.
<xmp>
@{
ViewBag.Title = "Index";
}<div>
<label>Current-Date: @DateTime.Now.ToString()</label>
<label>Current-Long Date: @DateTime.Now.ToLongDateString()
</label></div>
</xmp>
Inspect browser and search for “DateTime.Now.ToString()” on browser.We cannot find the C# code on the browser as we did.
If you inspect browser and search for “DateTime.Now.ToString()” on the browser. it could not see the C# code on the browser. We can only see the only HTML code. This is the job of View Engine which convert C# code into pure Html format in the browser.
2) Multi statement block
We can also define a multiline statement block as a single-line statement block. In a multiline statement block we can define multiple code statements and doprocess. A multiline block is between opening and closing curly braces {}, but the opening brace will have the "@" character in the same line if we define the "@" and opening curly braces in different lines then it will give an error.
<xmp><div>
@{
Var Java=100;
Var Rubi=200;
Var Ionic=400;
Var sum=(Java+Rubi+Ionic);
}
Sum of @Java and @Rubi and @Ionic is</div>
</xmp>
Now, let’s see how to write Razor code:
Variables
// Using the var keyword:
var a = "Welcome to MyProgram";
var b = 300;
var c = DateTime.Today;
// Using data types:
string greeting = "Welcome to MyProgram ";
int counter = 300;
DateTime day = DateTime.Today;
Now, in the above example, we have declared variables using “var” keyword as well as throughits types forexample. string, int, Date Time. You can declare any of them. Italso uses int, float, decimal, bool and string data types.
Conditions
If statement
It starts with code block and its condition is written in parenthesis and the code which needs to be executed once condition gets true is written inside braces.
Let’s understand with the below example.
<xmp>
@{var a=60;}
@if (a>50) { The a is greater than 50.
}
</xmp>
In the above example, we have declared var “a” has a value of 60 and we are using if statement which is validating value of “a”. If the value is greater than 50 then the code written in side braces is executed.
If – Else statement
Initially the code block and its condition arewritten in parenthesis and code which is needs to be executed once the condition gets true is written inside braces and if it does not gettrue then code write inside else block gets executed.
Let’s understand with the below example.
<xmp>
@ {var a=60;}
@if (a>50) { The value is greater than 50.
} else {
The value is less than 50.
}
</xmp>
In the above example, we have declared var “a” having a value of 60 and we are using if statement which is validating value of “a”. If the “a” is greater than 50 then the code written inside braces gets executed else the “a” is less than 50 and it will be executed.
Switch statement
It is used to check multiple times with different conditions.
<xmp>
@ {
var month = DateTime.Now.Year.ToString();
var message = "";
}
@ {
switch (month)
{
case "January":
message = "Starting of Year.";
break;
case "June":
message = "Middle of Year";
break;
case "December":
message = "End of Year";
break;
}
@message;
</xmp>
Looking to Hire .NET Core Developer ? Contact Now
Loops
Loops are used for executing same statement multiple times.
For Loops
If you know how many times you want to run the loop, you can use a For loop
<xmp>
@for(var i = 0; i < 10; i++) {
No @i
}
</xmp>
For Each Loops
Foreach loop is used when you are working with array.
<xmp>
@foreach (var x in Request.variable) {
@x
}
</xmp>
Model
If you want to use model in HTML page then you have to declare model shown below
<xmp>
@model modelname
Let's understand in the below example.
@model data Detail:
Id: @Model.Id
Name: @Model.Name
Age: @Model.Age
</xmp>
Now, in the above example, we have used data model which is created in the Model folder by declaring @model data and by using @Model, we are using its properties.
Conclusion
Using Razor View Engine,you can make dynamic HTML Pages and use to get the data from model and database.
Top comments (0)