How to use ternary operator to display some text instead of using if else conditions in react and typescript?

Question

i have code like below,

if (filteredIds.length > 0) {
    notify({
        title: `${
            type === "type1"
                ? 'type1 checks'
                : 'type2 checks'
        } started.`,
    });
 } else {
     notify({
         title: `${
             type === "type1"
                 ? 'type1 checks'
                 : 'type2 checks'
         } have been already running on selected id.`,
     });
 }

the above code works. But i want to use ternary operator to be used instead of if and else as the notify thing seems to be repetitive.

i want something like having the ternary operator in notify itself to return necessary text based on filteredIds length and type.

notify({
    title: `${ //condition here
        type === "type1" 
            ? 'type1 checks'
            : 'type2 checks'
    } started.`,
});

Basically i want the if else code to be less code. Could someone help me with this. I am new to programming and not sure how to use nested ternary operator. thanks.

If I am understanding it correctly, your conditional strings are have been already running on selected id. and started based on length of filteredId? — Imanpal Singh
– Imanpal Singh, Commented Aug 14, 2021 at 6:53

Imanpal Singh · Accepted Answer · 2021-08-14 06:56:15Z

1

Are you looking for a conditional expression like this?

notify({
    title: `${
        type === "type1" 
            ? 'type1 checks'
            : 'type2 checks'
    } ${filteredIds.length? 'started' : 'have been already running on selected id'}.`,
});

answered Aug 14, 2021 at 6:56

Imanpal Singh

1,2081 gold badge13 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

benmneb · Accepted Answer · 2021-08-14 07:00:16Z

1

if/else

if (filteredIds.length > 0) {
    notify({
        title: `${
            type === "type1"
                ? 'type1 checks'
                : 'type2 checks'
        } started.`,
    });
 } else {
     notify({
         title: `${
             type === "type1"
                 ? 'type1 checks'
                 : 'type2 checks'
         } have been already running on selected id.`,
     });
 }

ternary expression

 notify({
   title: `${
     type === "type1"
       ? 'type1 checks'
       : 'type2 checks'
   } ${filteredIds.length ? 'started.' : 'have been already running on selected id.'}`,
 });

answered Aug 14, 2021 at 7:00

benmneb

2,3532 gold badges26 silver badges31 bronze badges

Comments

Eziz Hudayberdiyev · Accepted Answer · 2021-08-14 07:04:10Z

0

interface Result {
  title: string
}

const notify = (title: string): Result => {
  // checking condition logic
  // if (type) {
  // ...
  // }
  return {title: 'your result here'}
}

And then

notify('argument')

answered Aug 14, 2021 at 7:04

Eziz Hudayberdiyev

4594 silver badges10 bronze badges

Collectives™ on Stack Overflow

How to use ternary operator to display some text instead of using if else conditions in react and typescript?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related