JavaExp: Java and Open Source Technology

The ngSwitch directive is an inbuilt directive that lets you hide/show HTML elements depending on an expression. NgSwitch uses ngSwitchCase keyword to define a set of possible element which will be selected based on the ngSwitchCase <element ngSwitch="expression">   <element *ngSwitchCase="value"></element>   <element *ngSwitchCase="value"></element>   <element *ngSwitchCase="value"></element> </element> For Example say we want to design a simple Component which renders different kind of Input fields like Text, TextArea etc based on the parameters we are sending. Then we need some kind of If/Else or Switch statements to select the case. Following Plunker demonstrates working example of a ngWitchCase statement. Here is the link to the Plunker to try it out. https://plnkr.co/edit/AliFkb?p=catalogue

Handling Images is a very common in most of the web applications. Typically we need to render image in a webpage (very common) and some times we need to provide an user interface to upload images, editing images etc. We can save the uploaded image in the web application in multiple ways. For instance we can save images in base64 encoded format in database or we can save the uploaded images in file system on the server and store the image path in database. It has it's own advantages and disadvantages. Angular applications sometimes does not show the image if the image is in base64 econdoed form. While loading base64 images in Angular Application, based on different factors like Content Security Policy etc, Angular does not allow to load base64 encoded images in the HTML. It will append unsafe to the url, as a result the HTML does not show the image properly. For instance if I want to show the following image which is in base64. data:image/png;base64,aaaiskkAAAANSUhEUgAAAPA