Question

我试图检查互联网连接。每当连接丢失时，我想向用户显示警告，如果用户点击刷新按钮，我想再次检查连接...但是当我在连接丢失时取消订阅时，我无法再次订阅。我做错了什么？

  constructor( private alertController: AlertController ){

                    let connection = this.checkConnection().subscribe(data => {
                      let alert = this.alertController.create({
                          title: 'Error',
                          subTitle: "You lost connection !",
                          buttons: [ {
                     text: 'Refresh',
                     handler: () => {
                     connection.subscribe();
                }}]
               });

                  if(data == false){
                      alert.present();
                      connection.unsubscribe();
                  }
              }
                 );

        checkConnection() {

                   return Observable
                    .interval(500)
                    .map(() => {
                    return navigator.onLine;
                    });
                 }

更新

     let refresh$ = new Subject();
          let connection$ = refresh$.mergeMap(() => {
                        return Observable
                                .interval(50)
                                .map(() => navigator.onLine)
                                .filter(onLine => !onLine) 
                                .take(1); 
                      });

                      refresh$.next();

            connection$.subscribe(data => {
                    console.log(data)

            })

Answer 1

我认为你误解了观察者的工作方式。

当您取消订阅观察者时，作为观察者的消费者，您告诉可观察者您不再需要向您发出更多值。这是向观察者发出的推翻价值制造者的信号。所以，取消订阅是一条单行道 - 没有回头路。

但你可能仍然可以实现你想要的。从您的代码中，似乎有一个navigator.onLine布尔值，您可以检查以确定您当前是否在线。并且，如果该布尔值为false，则需要显示提示，告知用户它们已断开连接。此外，似乎您想要在此时停止检查连接，直到用户点击“刷新”为止。然后在那时，你想继续检查。

如果我的流程正确无误，那么您可以使用可观察的链来实现这一目标。

基本上，你需要多个可观察的组合来获得你想要的效果。

let refresh$ = new Subject();
let connection$ = refresh$.mergeMap(() => {
                    // on each refresh,
                    // create a new observable that checks every 50ms,
                    // but only emits if we are not online
                    return Observable
                            .interval(50)
                            .map(() => navigator.isOnline)
                            .filter(isOnline => !isOnline)  //only emit a when we go offline 
                            .take(1);  // just need a single value to notify us to bring up our alert prompt
                  });

因此，在上面的示例中，只要您想开始检查脱机连接，刷新$就是您在next（）上调用的Subject。您第一次检查时会手动拨打refresh.next()，然后在每次按下刷新按钮后拨打refresh$.next()。

connection$是您可以观察到的，只要收到价值，您就会订阅显示提醒框的位置。

我可能没有让你的确切用例正确 - 我不得不根据你提交的代码猜测 - 但希望这可以让你思考如何实现你想要的结果。

Angular 2通过按钮订阅/取消订阅

1 个答案: