How to make textarea to show text with HTML properties in Ionic? - ionic-framework

I have added a textarea on my home.html page. The problem is if I am adding data line wise by pressing enter, now when i save it in the database and show it back on page, it comes in one line
This is how I type:
1. Line one
2. Line two
3. Line three
This is how it is seen on the page:
1. Line one 2. Line two 3. Line three
Below is my HTML code:
<ion-textarea rows="1" autosize #input (click)="focusInput(input)" (input)="change()" id="messageInputBox" placeholder="Type Something To Send.." type="text" name="TAG" [(ngModel)]="TAG" style="z-index:9.99999; color:#818993;font-size:18px; ">
</ion-textarea>
How can I resolve this issue?

Where you echo the contents of your TAG model in your HTML template, you should use a pipe like nl2br-pipe and use it like this:
<div [innerHtml]="TAG | nl2br"></div>
Be aware that you also should sanitize your HTML, before echoing it to your page, more on that here.

Related

VSCode Wrap HTML attributes each on their own line

I'm looking for a setting or extension in VSCode that provides the following functionality:
Format on save
wrap html attributes on their own line, even if there is only one attribute
put closing symbol of opening tag on new line, aligned with tag
alphabetically order attributes
do not align attributes according to the position of the first attribute, simple use one level of indentation
Example 1:
<span my-attr="value">Hello, world!</span>
becomes
<span
my-attr="value"
>
Hello, world!
</span>
Example 2:
<x-status-indicator wire:click="pushMe" class="block" :status="$status"
:description="$description" />
then becomes
<x-status-indicator
:description="$description"
:status="$status"
class="block"
wire:click="pushMe"
/>
So far there have been many posts about formatting, but I could not find a single post or extension that satisfies these requirements. Any suggestions would be greatly appreciated, thank you! :)

Visual Studio Code and Prettier html formatting on separate lines

I'm using VS Code, and Prettier and cannot get it to format the way I want it to be upon saving.
If I have a line like
<input type="checkbox" /> Label<br />
upon format/save, it becomes
<input type="checkbox" />
Label
<br />
I don't want to turn off Format on Save since I want to be able to Format Document from time-to-time. Is there a setting to get the line breaks how I want them? I'd prefer it only wrap on line length and other wanted places (e.g. select and option tags on different lines)
Note: this is just a simplified example. There are many other cases where it's putting every tag on a separate line when I'd like them to stay on one.
You need to update your .prettierrc file in your root to have
"printWidth": 1000
or whatever print width you are looking to have and it should fix this. Also check out the Prettier docs at https://prettier.io/docs/en/configuration.html to see other items you can configure.

In Tritium, how do I remove text from a node?

I have some HTML content structured like this:
<div>
random text I want to remove
<span>Important Text #1</span>
more text I want to remove
<span>Important Text #2</span>
</div>
How do I remove the text in this div while keeping the important content?
Use remove_text_nodes() to remove text.
Please check this url for solution :- http://tritium.moovweb.com/c3387d70958324469350596c6ef334a7da4ac4f1

snowbabel extension <br /> tag displayed in frontend

I've a problem with typo3 snowbabel extension. I need to insert a line break in frontend. In the manual, specified that "if you want to have a line break visible in front end, you'll have to insert the HTML line break tag.
I've added it. But the html br tag displayed in frontend.Also the line break is not working.
Is there any configurations for this?
Thanks,
Arun Chandran
This is just a handy quick solution to the problem.
You can use <section> tags instead of "<br/>" tags. Even though their purpose might be different, it still gives the output.
OR
Just use <br></br> instead of </br>. Works fine.

How to prevent Eclipse from indenting textarea's content on Ctrl+Shift+F?

I'm using Eclipse (Juno). I have a form on a JSP page that has a textarea as follows:
<textarea name="t"><c:out value="${val}" /></textarea>
When I format the code (ctrl shift F) it becomes:
<textarea name="t">
<c:out value="${val}" />
</textarea>
Which is fine except that it inserts extra spaces and lines in the text area. I like formatting my code using Eclipse, but the spaces/lines get added to the database when the form is submitted. Even worse, it gets compounded every time that form is submitted again. What am I doing wrong?
Try adding "textarea" to the list of inline elements on the Web->HTML Files->Editor preference page.