I want to replace my "undefined" values in my table with " ", to get only empty cells.
This is what i tried:
<tr *ngFor="let name of data">
<td>
{{name !== undefined ? name : ''}}
</td>
Nothing changed, how can i manage the undefined values?
Try like this.
If name contains any real value it will be used, otherwise empty string
{{name || ''}}
If name contains "undefined" world as string, rule above will print that string
You can do this:
{{ name ? name : ''}}
so whenever name is falsy, and undefined is falsy, it will return an empty string, when it's truthy it will return name.
Related
I am having problems using ternary operators with typescript,
please check the code to understand what I am trying to say.
`
const QuizQuestionContainer = ({ qa }: QuizQuestionContainerPropsType) => {
const { question, option1, option2, option3, option4 ,checked } = qa;
return (
<>
<h4>{question}</h4>
<form>
<input
type="radio"
value={option1}
name="option"
onClick={checkOption}
{checked === option1 ? "defaultChecked": ""}
/>
);
};
export default QuizQuestionContainer;
`
I am receiving a props "qa" and I destructured the value
"checked" from it and I want the input to be checked
by default if the "checked" is equal to the option but
it is throwing an error saying
"'...' expected.ts(1005)"
and
"Spread types may only be created from object types.ts(2698)"
You need to define what prop name you're providing a value for!
{checked === option1 ? "defaultChecked": ""} is a valid boolean value, but you need to assign it to an input prop. Maybe you're looking to do checked={option1 === "defaultChecked"}?
This could be a result of the checked variable having the same name as that input prop -- might be helpful to rename the variable to isChecked to avoid confusion in the future.
If you want to set the prop defaultCheck using the condition you mentioned, change to:
defaultChecked={checked === option1}
I believe what you want to do here is determine if the input is checked
checked accepts a boolean (true = checked)
changed to this:
checked={checked === option1}
I want to print the address in the following order and I was able to do that. My problem is for some users some address fields are null then it is printing like this (1804 E Broadway, , 223344) and also I want divide the address in to lines.
<td>${addr1 }, ${addr2 }, ${postalCode }</td>
You can achieve your requirement is 3 ways:
1. JSP EL
<!-- here I am using adjacent EL expression because string concat will not work here and if we put EL expression in new line one space is adding-->
<td>${addr1 }${empty addr1? '': ','}
${addr2 }${empty addr2? '': ','}
${postalCode }</td>
2. JSTL
<c:if test="${not empty addr1}">
${addr1},
</c:if>
3. Using java code in JSP
I will not recommend this method because writing java code in JSP is not encouraged.
<%= (addr1 != null && addr1 !="") ? addr1 +",": "" %>
You can use a ternary operator in your JSP like this:
<%= (field != null && field !="") ? field +",": "" %>
I am showing the information in the table using angularjs,html.
I want to strike through the ID displayed in the second column of the table whose status is "delivered" given in productstatus of $scope.items.
Demo : http://plnkr.co/edit/m0x5TQNY4QprCF5CqRSn?p=preview&preview
I tried as below , but unable to show strikethrough for productID's 10,12 in row1 and 11A,100AX in row3:
<a ng-repeat="pid in item.productid.split(',')" href="https://urladdr/associateid={{associateNum}}" target="_blank">
<span data-ng-class="item.productstatus.split(',')[$index] === 'delivered' ? 'strikethrough' : 'null'">{{pid}}
</span><span ng-if="$index+1 != item.productid.split(',').length">;</span>
</a>
json object:
$scope.items = [{
"name":"John",
"product":"Laptop",
"productid":"10,11X,12",
"standing": true,
"productstatus":{"10":"delivered","11x":"Shipped","12":"delivered"}
},{
"name":"Rob",
"product":"Mobile",
"productid":"13PX",
"standing": true,
"productstatus":{"13PX":"Shipped"}
},{
"name":"Dan",
"product":"Laptop",
"productid":"",
"standing": true,
"productstatus":null
},{
"name":"Robert",
"product":"Laptop",
"productid":"11A,100AX",
"standing": true,
"productstatus":{"11A":"delivered","100AX":"delivered"}
}]
You're trying to split a json object which you can't do. If productstatus is changed to a string you can keep your code as is. Otherwise you'll want to do a ng-repeat with key/value pairs. (i.e. ng-repeat="(key, prop) in item.productstatus" or use the key directly i.e. data-ng-class="item.productstatus[pid] === 'delivered' ? 'strikethrough' : 'null'"
The following works for me if you want to copy and replace your code:
<a ng-repeat="pid in item.productid.split(',')" href="https://urladdr/associateid={{associateNum}}" target="_blank">
<span data-ng-class="item.productstatus[pid.trim()] === 'delivered' ? 'strikethrough' : 'null'">{{pid}}
</span><span ng-if="$index+1 != item.productid.split(',').length">;</span>
</a>
Updated: added trim() based on comments.
Pay attention that your data structure of item.productstatus is an Object and not Array.
Therefore you should change the usage to something like that: item.productstatus[pid].
http://plnkr.co/edit/s7ySyexnVrhzSXkY
Pro TIP: Use the map to boolean option of ng-class directive, it is more cleaner.
ng-class="{className: item.productstatus[pid] === 'delivered'}"
The result of the evaluation can be a string representing space delimited class names, an array, or a map of class names to boolean values. In the case of a map, the names of the properties whose values are truthy will be added as css classes to the element.
SQL (Active column is of type bit):
id Question Active
1 Weather today 1
ASP.net Eval:
<img src='<%# Eval("Active") == "1" ? "images/active.png" : "images/inactive.png" %>' />
HTML:
<img src="images/inactive.png">
Why is the inactive.png image showing and not the active.
Bit fields correspond to boolean. Also you need to do a type conversion to ensure right comparison is done, as Eval outputs just object. So:
(bool)Eval("Active") == true
You could try to cast the result:
((int)Eval("Active")) == 1 ? [...]
or as mentioned in the comments to a bool:
((bool)Eval("Active")) == true ? [...]
I have some values in my database which can be null if they have not already been entered.
But when I use Thymeleaf in my html, it gives an error when parsing null values.
Is there any way to handle this?
The shortest way is using '?' operator. If you have User entity with embedded Address entity in order to access fields of Address entity and print them if address is not null, otherwise here will be an empty column:
<td th:text="${user?.address?.city}"></td>
Sure there is. You can for example use the conditional expressions. For example:
<span th:text="${someObject.someProperty != null} ? ${someObject.someProperty} : 'null value!'">someValue</span>
You can even omit the "else" expression:
<span th:text="${someObject.someProperty != null} ? ${someObject.someProperty}">someValue</span>
You can also take a look at the Elvis operator to display default values like this:-
<span th:text="${someObject.someProperty} ?: 'default value'">someValue</span>
This can also be handled using the elvis operator ?: which will add a default value when the field is null:
<span th:text="${object.property} ?: 'default value'"></span>
You can use 'th:if' together with 'th:text'
<span th:if="${someObject.someProperty != null}" th:text="${someObject.someProperty}">someValue</span>
Also worth to look at documentation for #objects build-in helper:
https://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html#objects
There is useful: ${#objects.nullSafe(obj, default)}
You've done twice the checking when you create
${someObject.someProperty != null} ? ${someObject.someProperty}
You should do it clean and simple as below.
<td th:text="${someObject.someProperty} ? ${someObject.someProperty} : 'null value!'"></td>
<p data-th-text ="${#strings.defaultString(yourNullable,'defaultValueIfYourValueIsNull')}"></p>
you can use this solution it is working for me
<span th:text="${#objects.nullSafe(doctor?.cabinet?.name,'')}"></span>
I use
<div th:text ="${variable != null} ? (${variable != ''} ? ${variable} : 'empty string message') : 'null message' "></div>
The shortest way! it's working for me,
Where NA is my default value.
<td th:text="${ins.eValue!=null}? ${ins.eValue}:'NA'" />