Изменения, сделанные в методе .subscribe (), не отражены в нем или в шаблоне - PullRequest
0 голосов
/ 27 мая 2019

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

Я попробовал решения, перечисленные в ответах на следующий вопрос: Angular 2 View не будет обновляться после изменения переменной в подписке

в service.ts:

startedEditing= new Subject<number>();

в details.component.ts (где данные передаются по fu):

onEdit(){
    this.contactsService.startedEditing.next(this.id);
  }

в edit-component.ts (в ngOnInit):

this.subscription=this.contactsService.startedEditing.subscribe(
      (index:number)=>{
        this.editMode=true; 
        this.editedItemIndex=index;
        this.editItem=this.contactsService.getContact(this.editedItemIndex);         
          this.editForm.setValue({
            address:this.editItem.address,
            name: this.editItem.name,
            phone:this.editItem.phone,
            profession:this.editItem.profession
          });
          console.log("in subscribe: "+this.editedItemIndex);

      }
    );
    console.log("out of it :" + this.editedItemIndex);
  }

вывод на консоль:

in subscribe: 0
out of it : undefined

ожидаемый результат:

in subscribe: 0
out of it :0

Ответы [ 2 ]

0 голосов
/ 27 мая 2019

Это нормально, что t his.editedItemIndex не определено в console.log("out of it :" + this.editedItemIndex); Код над этой частью является асинхронным , поэтому при запуске console.log("out of it :" + this.editedItemIndex); код внутри подписки еще не выполняется, а this.editedItemIndex еще не инициализирован. Теперь ngOnInit - это первый метод, который вызывается в вашем компоненте, поэтому в других методах или в шаблоне this.editedItemIndex должен быть уже инициализирован и не определен. может быть, вы можете поделиться своим HTML-кодом или в других местах, где он не определен, так что ответ может быть более точным.

0 голосов
/ 27 мая 2019

console.log("out of it :") будет работать только при инициализации вашего компонента, и в этот момент this.editedItemIndex равно undefined , поскольку startedEditing не изменилось, поэтому строка this.editedItemIndex=index не была запущена.

Это асинхронный !Если вы делаете startedEditing.subscribe(), это потому, что вы чего-то ждете (например, значение).Если вы попытаетесь получить значение вне подписки, оно не будет ждать значения и покажет undefined.

И если вы попробуете свой код, реальный вывод должен быть:

out of it : undefined
in subcribe : 0
...