Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Angular 2异步管道不会使用Observable呈现新值大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我在我的应用程序中使用NgRx Store.

Home.html中

<list-objects
      [array]="array| async"
      (Edit)="Edit($event)"
      (Delete)="delete($event)"
 ></list-objects>

Home.ts

export class HomePage {
     public array: Observable<itm[]>;

     constructor(){
          this.array= this.store.SELEct(state => state.array);

          this.array.subscribe((a) => {
             console.log(a); //VALUES OK
          }
      }

      Edit(event){
          this.store.dispatch(this.actions.updateItem(event.item));
      }
  }

当我编辑数组项时,异步管道不更新视图,但“数组”对象中的值是更正的(订阅中的console.log显示更新的值).当我点击DOM中的某个位置(打开模态,单击按钮…)时,使用新值查看更新.

我还记录子组件“ngOnChanges”,它不会触发新值.

解决方法

尝试这样的事情:

(注意,此代码未经过测试).

<list-objects
      [array]="array"
      (Edit)="Edit($event)"
      (Delete)="delete($event)"
 ></list-objects>

export class HomePage {
     public array: itm[];

     constructor( private zone:NgZone ){
        this.store.SELEct(state => state.array).subscribe((a) => {
              this.zone.run(() => {
                   this.array = a;
              });
          }
      }

      Edit(event){
          this.store.dispatch(this.actions.updateItem(event.item));
      }
  }

我从模板中删除了异步管道,并直接分配了数组.通过在this.zone.run中执行此操作,摘要周期将触发,您的模板将重新呈现.

摘要周期通常仅在许多预定义的情况下触发,例如http方法回调,UI输入.这里没有发生过,所以Angular不知道要更新.

大佬总结

以上是大佬教程为你收集整理的Angular 2异步管道不会使用Observable呈现新值全部内容,希望文章能够帮你解决Angular 2异步管道不会使用Observable呈现新值所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。