Escaping the @ Symbol in an MVC View

I’ve been working with OData recently and one thing that briefly stumped me was that the property names begin with @ and in an MVC view the @ symbol is used to indicate C# code so when I tried to reference a property in JavaScript the page then thought I was trying to write C#!

The way to escape an @ symbol is (perhaps obviously) to use another @.

So in my case I was recieving something similar to the following OData response. This sample comes from https://services.odata.org/TripPinRESTierService/(S(jxes55yyizo3gzxle5xg5nlr))/People?$top=1, this should theoretically also accept a $count=true parameter which would provide the total object count but this doesn’t seem to work so I’ve just added it in below.

{
	"@odata.context": "https://services.odata.org/TripPinRESTierService/(S(jxes55yyizo3gzxle5xg5nlr))/$metadata#People",
	"@odata.count": 20,
	"value": [
		{
			"UserName": "angelhuffman",
			"FirstName": "Angel",
			"LastName": "Huffman",
			"MiddleName": null,
			"Gender": "Female",
			"Age": null,
			"Emails": [
				"Angel@example.com"
			],
			"FavoriteFeature": "Feature1",
			"Features": [],
			"AddressInfo": [
				{
					"Address": "55 Grizzly Peak Rd.",
					"City": {
						"Name": "Butte",
						"CountryRegion": "United States",
						"Region": "MT"
					}
				}
			],
			"HomeAddress": null
		}
	]
}

From this response I wanted to reference the count value but in order to do that I needed to use @@count.

JavaScript also doesn’t allow properties to start with non-alphanumeric characters so if you want to use these they have to be escaped in square brackets and quotes as well.

function responseHandler(res) {
	return {
		total: res['@@odata.count'],
		rows: res.value
	};
}