Показать неанглийский текст в приложении Angular

Используя Angular v5, я создал приложение. На одной из страниц я должен показать описание продукта на языке, выбранном пользователем - _descriptionLang. Текст описания выводится из БД с помощью службы http.

HTML -

<tr *ngFor = "let item of productList">
    <td>{{item.productNo}}</td>
    <td *ngIf = "_descriptionLang === 'EN'">{{item.description_en}}</td>
    <td *ngIf = "_descriptionLang === 'FR'"><span lang = "fr">{{item.description_fr}}</span></td>
    <td *ngIf = "_descriptionLang === 'GE'"><span lang = "de">{{item.description_ge}}</span></td>
    <td *ngIf = "_descriptionLang === 'IT'"><span lang = "it">{{item.description_it}}</span></td>
    <td *ngIf = "_descriptionLang === 'RU'"><span lang = "ru">{{item.description_ru}}</span></td>
    <td *ngIf = "_descriptionLang === 'SP'"><span lang = "es">{{item.description_sp}}</span></td>
</tr>

component.ts -

     searchCombinations(searchInput) {
        this.productService.getProductDetails(searchInput)
          .subscribe(response => {
            this.productList = response.records;
           });
      }

Ответ службы JSON -

Показать неанглийский текст в приложении Angular

Приведенный выше код не показывает неанглийское описание, и я получаю пустое поле в столбце описания.

Перевод описания с английского на выбранный язык не является моим требованием.

Может кто-нибудь помочь мне здесь?

ваша проверка состояния работает нормально?

Aravind S 13.07.2018 08:11

@AravindS да ... Я это проверил.

Akshaya Jeevan 13.07.2018 08:12

например использовать вот так <span [innerHTML] = "item.description_fr">

coder 13.07.2018 08:14

Не могли бы вы также предоставить логику своих компонентов, и дважды проверьте item.description_fr и аналогичные переменные не возвращают undefined

Niragh 13.07.2018 08:18

@coder Я пробовал [innerHTML] .... результат тот же ..

Akshaya Jeevan 13.07.2018 08:39

Добавлен код компонента и ответ json.

Akshaya Jeevan 13.07.2018 08:39

не могли бы вы предоставить демонстрацию stackblitz об этой проблеме?

coder 13.07.2018 08:50

Там все нормально, может быть, вы неправильно выставляете _descriptionLang?

Niragh 13.07.2018 08:54

Попробуйте удалить все атрибуты ngIf и посмотреть, появятся ли они. Я предполагаю, что что-то не работает при проверке состояния.

Adrian Fâciu 13.07.2018 09:01
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
9
45
0

Другие вопросы по теме