Блог

Главная - Вопросы по программированию - Логический ввод не работает с ngif в дочернем html

Логический ввод не работает с ngif в дочернем html

#angular

#angular

Вопрос:

извините за мой плохой английский, а не мой основной язык.

У меня проблема, у меня есть логическая переменная в родительском компоненте для переключения языка. У меня есть 2 ngif во всех моих компонентах для переключения языка, если var имеет значение true или false.

компонент приложения:

 public euskera: boolean;


  constructor(){
    this.euskera=false;
  }
  ngOnInit(): void {
    
  }

  setEuskera(){
    this.euskera=true;
  }

  setCastellano(){
    this.euskera=false;

компонент приложения html:

 <div *ngIf="euskera">
  <header id="header">
    <img id="logo" src="../assets/img/logoSoinuka.png">
      <nav id="nav">
        <ul>
  
          <li [routerLink]="['/inicio']"><a>hasiera</a></li>
          <li [routerLink]="['/sobre-nosotros']"><a>nor gara?</a></li>
          <li [routerLink]="['/proximos-eventos']"><a>hurrengo ekitaldiak</a></li>
          <li [routerLink]="['/contacto']"><a>kontaktua</a></li>
          <li (mouseenter)="mostrarLenguajes()" (mouseleave)="esconderLenguajes()"><a>Hizkuntza:<span>[</span></a></li>
        </ul>
  
      </nav>
  
  
  </header>

  <div id="language" (mouseenter)="mostrarLenguajes()" (mouseleave)="esconderLenguajes()">
    <ul>
  
      <li(click)="setCastellano()"><a>Gaztelania</a></li>
      <li (click)="setEuskera()"><a>Euskara</a></li>
    </ul>
  </div>
  
</div>


<div *ngIf="!euskerafalse">
  <header id="header">
    <img id="logo" src="../assets/img/logoSoinuka.png">
      <nav id="nav">
        <ul>
  
          <li [routerLink]="['/inicio']"><a>Inicio</a></li>
          <li [routerLink]="['/sobre-nosotros']"><a>¿Quienes somos?</a></li>
          <li [routerLink]="['/proximos-eventos']"><a>Proximos eventos</a></li>
          <li [routerLink]="['/contacto']"><a>Contacto</a></li>
          <li (mouseenter)="mostrarLenguajes()" (mouseleave)="esconderLenguajes()"><a>Lenguaje:<span>[</span></a></li>
        </ul>
  
      </nav>
  
  
  </header>

  <div id="language" (mouseenter)="mostrarLenguajes()" (mouseleave)="esconderLenguajes()">
    <ul>
  
      <li(click)="setCastellano()"><a>Castellano</a></li>
      <li(click)="setEuskera()"><a>Euskera</a></li>
    </ul>
  </div>
  
</div>


<div class="son">
    <app-home [euskera]="euskera"></app-home>
  </div>

<body>
  <div id="content">
    <router-outlet></router-outlet>

  </div>
</body>

Домашний компонент (дочерний)

   @Input() euskera:boolean=false;

html-компонент Home (дочерний)

 <div *ngIf="euskera">
  euskera language 
</div>

<div *ngIf="!euskera">
Espanol language 
</div>

Если я использую console log, значение переменной изменяется с True на false и с false на True, но ngif показывает только текст false (загруженный по умолчанию) при изменении значения переменной из родительской, она не интерпретируется из дочерней, поскольку IF у меня не работает

Что я могу сделать? Помогите мне, пожалуйста, я застрял на этом этапе. Спасибо

Комментарии:

1. Это опечатка? <div *ngIf=»!euskerafalse»>

2. О, извините, это ошибка при редактировании кода из Интернета. Правильный код на моем компьютере <div *ngIf=»!euskera»>

3. Хорошо, никаких проблем. Еще одна странная вещь — дополнительный элемент <body> .. у вас уже должно быть тело в index.html . Кроме того, то, что у вас должно работать ..?

4. @MikeOne Я попытался удалить тело, но ничего не произошло. Я не знаю, как я могу это исправить…

5. Могу ли я отправить вам ссылку на YouTube с видео о моей проблеме???