если условно внутри строки

Question

Мне нужно установить innerhtml элемента, но некоторая часть кода является условной. Так как я не могу добавить к innerHtml, я хочу поставить условное. Я совершенно новичок в JS, поэтому я не смог найти способ сделать это, потому что я путаюсь со знаками "` ".

Я видел некоторые методы для добавления к innerHtml, но я хочу более чистый способ сделатьэто

    el.innerHTML = `
    <ion-avatar slot="start">
        <img src="https://www.gravatar.com/avatar/${i + originalLength}?d=monsterid&f=y">
      </ion-avatar>

    <ion-label>
    <name>${users[t].name}</name>
    <br>

        ******IF JS CONDITIONAL( IF ${users[t].lista} !="") ******    
    <ion-chip><ion-label><lista><p>Lista ${users[t].lista}</p></lista></ion-label></ion-chip>
        <br>
        ******END IF JS CONDITIONAL******

        <ion-chip outline color="primary"><ion-icon name="cash"></ion-icon><p><?php echo $product->getLabelPrice1() ?>: ${users[t].valor1} <?php echo $product->getLabelPrice2() ?>: ${users[t].valor2}</p></ion-chip>

    </ion-label>
    `;

Answer 1

Один вариант использует conditional (ternary) operator Как:

${
    foo === 1 ?                                       //Check if variable is one            
        '============= foo is 1 ============='        //If condition above is true              
    :           
        '============= foo NOT is 1 ============='    //If condition above is false
}

Пример

let foo = 1;

let str = `
	Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
	Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
				
	    ${
	       foo === 1 ? 
					
	          '============= foo is 1 ============='
					
	       :
					
	          '============= foo NOT is 1 ============='
	    }
				
	Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
	Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
	`;

console.log(str);

Answer 2

Так что я не знаю, насколько это повлияет на ваш код, и это может быть просто моим предпочтением, но я думаю, что вместо этого используется одиночный тик (') и серьезный символ (`) ... такЯ бы заменил это (могилу) на один тик в вашем коде. Затем, чтобы продолжить, я совершенно уверен, что вы не можете использовать php внутри javascript (основываясь на моих очень примитивных знаниях), сначала веб-страница запускает php, генерирует html, а затем отправляет информацию обратно на сторону клиента. Так как javascript запускается после того, как страница выполняет php, вы не можете поместить php-код в html-страницу, которая уже была создана, это короткая история (Это было бы как после выпечки торта, пытаясь добавить яйца, которыеВы забыли добавить в начале). С точки зрения замены «innerHTML» элемента с использованием javascript, это довольно просто.

    document.getElementById('my_element_id').innerHTML = '<!--inner contents-->';
    document.getElementsByClassName('my_elements_from_my_class')[0] = '<!--inner contents-->';
    /*NOTE: getElementsByClassName returns an array, in which you can index the elements by using [element number - the first element is 0]*/

Надеюсь, это поможет.