Если у меня есть логическое значение в файле Typescript, как я могу получить к нему доступ в соответствующем файле HTML?

Question

У меня есть логическое значение, которое задается в файле Typescript компонента Angular, и я хочу отображать некоторый текст в файле HTML, только когда логическое значение истинно.Как я могу это сделать?

Машинопись:

this.displayButton = true;

HTML:

<script>
    if ({{ displayButton }} = true) {
        document.write("<span>Some text</span>");
    } else {
        document.write("<span>Some other text</span>");
    }
</script>

Answer 1

Вы можете сделать это, используя структурную директиву *ngIf:

<div *ngIf="displayButton">
<span>Some text</span>

<div *ngIf="!displayButton">
<span>Some other text</span>

---

Или просто в одну строку (как указал @Plixxer):

<span>{{ displayButton ? 'some text' : 'some other text'}}</span>

Answer 2

Вы можете использовать условие if в теге, подобном этому

<button *ngIf="this.displayButton =='true'"  >      
            </button>

или вы можете использовать функцию, которая возвращает true, если переменная установлена ​​в true

<div *ngIf="isResult()">
</div>

isResult () - это функция, которая будет возвращать логическое значение из файла .ts

Answer 3

Я думаю, что проблема в том, что вы проверяете значение логического значения неправильно. Вы должны использовать два '=' вместо одного.

Пример:

if ({{displayButton}} == true)