Angular2替代Angular2忙吗？

我构建应用程序是为了与angular2 busy一起工作：

它非常适用于为可观察对象显示加载动画

不幸的是，当我绑定项目时，它没有设置为使用“-aot:

ng build--prod--aot

，因为它出错了

出于用户体验的目的，我真的更喜欢在用户执行搜索时加载动画，但我还没有找到一个很好的手动加载的教程/过程

---

谢谢。

如果您订阅了Observable，您可以手动执行此操作，例如使用jsrx，您可以设置如下内容：

角度2组件：

    @Component({
      moduleId: module.id,
      selector: 'sd-offer',
      templateUrl: 'offer.component.html',
      styleUrls: ['offer.component.css']
    })
    export class OfferComponent {
      public offers$: Observable<Offer>;
      private busy:boolean;

      constructor(private store: Store<IAppState>, public routerext: RouterExtensions) {
        this.busy = true;
        // returns observable
        this.offers$ = store.let(getOffers);    

        this.offers$.subscribe(
          (x) => { // next
            console.log('Next ' + x);
            this.busy = false;
          },
          (err) => { // error
          console.log('Error: ' + err);
            this.busy = false;        
          },
          () => { // completed
            console.log('Completed');
            this.busy = false;
          }      
        );        
      }
  // ...
}

@组件({
moduleId:module.id，
选择器：“sd报价”，
templateUrl:'offer.component.html'，
样式URL:['offer.component.css']
})
出口类报价组件{
公开发售：可观察；
私有忙：布尔值；
构造函数（私有存储区：存储区，公共路由扩展区：路由扩展区）{
this.busy=true；
//可观测收益
this.offers$=store.let（getOffers）；
此。提供美元。订阅(
（x） =>{//next
console.log（'Next'+x）；
this.busy=false；
},
（err）=>{//error
log（'Error:'+err）；
this.busy=false；
},
（）=>{//已完成
console.log（'Completed'）；
this.busy=false；
}      
);        
}
// ...
}

组件的HTML模板：

<span *ngIf="busy">
  <h3>Loading...</h3>
</span>

<div *ngIf="!busy">
  <a *ngFor="let offer of (offers$ | async)" href="{{offer.link}}">
      <img src="{{offer.img}}" alt="{{offer.name}}">
  </a>
</div>

加载。。。

这将显示

加载。。。

在后台提取数据时

---

或者，您可以更换加载。。。带微调器的字符串img

现在增加了AOT支持。

那么你的意思是每次发出

http

请求时都要显示加载程序？这是一个普通的应用程序，我正在使用router.get从MongoDB返回json结果。你找到解决方案了吗@你知道我在所有的http调用上显示加载吗？我打开了一个线程，它也有一个新版本的问题a@angular/普通，@angular/core-检查此链接