Изменения в переменной не отправляются

у меня есть сервис, компонент и модуль.

в службе, которой я хочу отправить изменения переменной флаг$.

export class ListUserService {
    public flag$ = new Subject< boolean >();
}

Этот компонент вносит изменения в переменную

export class ListUserComponent implements OnInit {
    private flagPerfil = false;

    getFlag() {
        return this.flagPerfil;
    }


  constructor(private listUserService: ListUserService) {

  }

  functionThatGetsCalledWhenTheFlagIsChanged(){
     this.listUserService.flags$.next(this.flagPerfil);
  }
}

Мне нужно получить переменную флаг$ в этом модуле:

export class Tab1PageModule {
    public flagPerfil: boolean;

    constructor(private listUserService: ListUserService) {
        listUserService.flag$.subscribe((flag)=>{
           console.info('FLAG', flag); //never show the console
           this.flagPerfil = flag;
      });
    }
}

никогда не заходит в эту консоль console.info('FLAG', flag); но возникает эта ошибка TS2322: тип «Тема» не может быть назначен типу «логический»., и в представлении модуля ничего не отображается

<ion-card-title> {{flagPerfil}} Puedes agregarlos para iniciar una amistad</ion-card-title>
Тестирование функциональных 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
0
157
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Используйте субъект поведения, поскольку они имеют значение по умолчанию, и любые новые наблюдатели получают последнее испускаемое значение, субъекты уведомляют наблюдателей только тогда, когда они испускают, последнее значение теряется для новых наблюдателей.

export class ListUserService {
  public flag$ = new BehaviorSubject<boolean>(false);
}

const { Subject, BehaviorSubject } = rxjs;

const subject$ = new Subject();
subject$.next('Subject initial val');
const behaviorSubject$ = new BehaviorSubject('BehaviorSubject initial val');

subject$.subscribe(val => { console.info(val); });
behaviorSubject$.subscribe(val => { console.info(val); });

subject$.next('Subject new val');
behaviorSubject$.next('BehaviorSubject new val');
<script src = "https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.4.0/rxjs.umd.min.js"></script>

И используйте асинхронный канал в своем компоненте, чтобы вам не нужно было подписываться в коде.

export class ListUserComponent implements OnInit {
  flags$ = this.listUserService.flags$;


  constructor(private listUserService: ListUserService) {

  }

  functionThatGetsCalledWhenTheFlagIsChanged(value: boolean){
     this.listUserService.flags$.next(value);
  }
}

и в шаблоне представления

<ion-card-title> {{flag$ | async}} Puedes agregarlos para iniciar una amistad</ion-card-title>

теперь, если показать консоль, но переменная никогда не будет отображаться в представлении модуля <ion-card-title> {{flagPerfil}} Puedes agregarlos para iniciar una amistad</ion-card-title>

user11450057 30.05.2019 01:57

представление принадлежит модулю и видит эту консоль console.info('', this.listUserService.flag$); // BehaviorSubject {_isScalar: false, наблюдатели: Array(0), Closed: false, isStopped: false, hasError: false, …}

user11450057 30.05.2019 02:20

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

Похожие вопросы

Входной параметр компонента получен как «неопределенный», но значение было указано
Как динамически создать html-таблицу с angular из многомерного массива?
Как я могу создать файлы перевода, если кендо-уи по умолчанию использует английские выражения, но я использую другой язык в своем приложении?
Angular 8 с Ivy, как проверить, что он используется
Фотография пользователя исчезает, когда я меняю пароль
Свойство @Input() в угловом компоненте возвращает пустой массив
Ошибка редуктора всегда не определена при передаче неправильного URL-адреса в NgRx в Ionic 3
Использование * ngFor внутри пользовательского шаблона ng #treeNodeTemplate приводит к бесконечному обновлению дерева, что приводит к сбою браузера
Angular 6, как получить количество определенного столбца на основе одного и того же значения из массива объектов
SwitchMap после того, как catchError не выдает значения