App Services – Page 5 – My Point of View

Angular 17 Local Install

Follow Steps To Install Angular CLI locally.

Disclaimer: I have Angular 16 Installed Globally. and will be installing 17 Locally (To install globally, follow this)

Create a folder in your local drive, say AngularTest.

> mkdir AngularTest
> cd AngularTest

Install your angular version (Make sure while installation you are not using -g at the end of the installation command);

> npm install @angular/cli@  (for any other version)
> npm install @angular/cli   (for current version)

Type following command in your AngularTest folder to confirm your version

> ng version

This will list down version for Angular CLI, Node, Package Manager and OS. If Angular is not compatible with Node, you will see a yellow message at the bottom of window. In that case you need to figure out correct node version for Angular.

Cheers!

You may be interested in Angular Getting Started Guide.

If you want to uninstall angular, follow this

Store Complex Object in TempData

To pass object from controller method to controller method use this extension methid;

public static class TempDataExtensions
{
    public static void Put<T>(this ITempDataDictionary tempData, string key, T value) where T : class
    {
        tempData[key] = JsonConvert.SerializeObject(value);
    }

    public static T Get<T>(this ITempDataDictionary tempData, string key) where T : class
    {
        object o;
        tempData.TryGetValue(key, out o);
        return o == null ? null : JsonConvert.DeserializeObject<T>((string)o);
    }
}

And, you can use them as follows:

Say objectA is of type ClassA. You can add this to the temp data dictionary using the above mentioned extension method like this:

TempData.Put("key", objectA);

And to retrieve it you can do this:

var value = TempData.Get<ClassA>("key") where value retrieved will be of type ClassA

To configure TempData in ASP.NET Core, Refer to this article

Reference

https://stackoverflow.com/questions/34638823/store-complex-object-in-tempdata

Passing TempData value from controller to controller

Refer to following code;

TempData["error"] = true;
return RedirectToAction("YourViewName", "YourControllerName);

On Redirect, TempData will become NULL. To solve this, try string test first;

On first controller method, set this;
TempData["error"] = "There is an error"

On a second controller method, get this;
var message = TempData["error"]

if you can see the message in second controller, no need to make any configuration changes. The problem is with your complex object serialization/deserialization

If TempData string (shown above) doesn’t work, then you need to make these configuration changes.

builder.Services.Configure<CookieTempDataProviderOptions>(options =>
{
    options.Cookie.Name = "TEMPDATA";
    //you have to avoid setting SameSiteMode.Strict here 
    options.Cookie.SameSite = SameSiteMode.Lax;
    options.Cookie.IsEssential = true;
   
});

We can pass values as query string in RedirectToAction method but we don’t want to show sensitive data in URL. So the alternate is to pass it as TempData that is using session at the backend or simply use Session.

Here is a simple comparison;

Maintains data between	ViewData/ViewBag	TempData	HiddenFields	Session
ControllerToController	NO	YES	NO	YES
ControllerToView	YES	NO	NO	YES
ViewToController	NO	NO	YES	YES

If you like to store/retrieve complex objects between controllers using TempData, use this extension method;

Reference

https://learn.microsoft.com/en-us/aspnet/core/fundamentals/app-state?view=aspnetcore-8.0#tempdata

https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.mvc.cookietempdataprovideroptions.cookie?view=aspnetcore-7.0

Treegrid Row Filter

When we apply filters in treegrid, Row property is set to true. Let’s say we have 100 records of VA and DC equally distributed 50/50. If we don’t apply any filter then Row Visible property of all records is true.

If we apply VA filter then 50 records visible property will be true and remining 50 will be false.

The twist is hidden rows. Let’s say we have 2 DC records selected. We apply VA filter then row visible property of 52 records will be selected. To get a clean picture we need to reset DC hidden rows.

For custom implementation OnAfterValueChanged Event. This is a generic event and can be used for anything (cells, rows etc).

Here is a sample code snippt;

$.each(grd.Rows, function (index, row) {
   if (row.Visible == true) {
     grd.SetValue(rw, 'Select', val, true);
   }
}

Reference

https://www.treegrid.com/Doc/RowAPI.htm

JavaScript equivalent to C# String.Format

From ES6 onward, you could use template strings:

let soMany = 10;
console.log(`This is ${soMany} times easier!`);
// "This is 10 times easier!"

Here is the reference;

https://stackoverflow.com/questions/610406/javascript-equivalent-to-printf-string-format