1 00:00:03,950 --> 00:00:07,125 In der vorherigen Übung 2 00:00:07,125 --> 00:00:13,625 haben wir unsere Angular-Anwendungsdienste aktualisiert, um Versprechen zu verwenden, 3 00:00:13,625 --> 00:00:15,960 und auch die Komponenten zu aktualisieren, um 4 00:00:15,960 --> 00:00:19,245 mit den Versprechen umzugehen, die von den Diensten zurückgegeben werden. 5 00:00:19,245 --> 00:00:24,280 In dieser Übung, die eine Erweiterung zur vorherigen Übung darstellt, 6 00:00:24,280 --> 00:00:29,485 werden wir eine Zeitverzögerung simulieren, damit das Versprechen gelöst werden kann. 7 00:00:29,485 --> 00:00:31,240 In der vorherigen Übung 8 00:00:31,240 --> 00:00:33,490 wurden die Versprechungen sofort gelöst. 9 00:00:33,490 --> 00:00:35,540 Aber im wirklichen Leben, 10 00:00:35,540 --> 00:00:42,934 wenn Sie Daten von einem Dienst anfordern und der Dienst ein Versprechen liefert 11 00:00:42,934 --> 00:00:44,540 , 12 00:00:44,540 --> 00:00:47,900 muss der Dienst wiederum die Daten von einem Back-End-Server abrufen, was 13 00:00:47,900 --> 00:00:49,295 Zeit in Anspruch nehmen wird. 14 00:00:49,295 --> 00:00:51,310 Also, für das Versprechen zu lösen, 15 00:00:51,310 --> 00:00:53,740 wird es eine gewisse Zeitverzögerung geben. 16 00:00:53,740 --> 00:00:59,880 Nun, wie gehen wir mit dieser Zeitverzögerung auf unserer Komponentenseite um? 17 00:00:59,880 --> 00:01:04,040 Wie halten wir den Nutzer darüber auf dem Laufenden, dass es 18 00:01:04,040 --> 00:01:09,810 eine Zeitverzögerung gibt, bevor die Daten abgerufen und dem Nutzer angezeigt werden können? 19 00:01:10,070 --> 00:01:14,490 Wie gehen wir mit der Verzögerung selbst um? 20 00:01:14,490 --> 00:01:15,830 In dieser Übung 21 00:01:15,830 --> 00:01:24,820 simuliere ich nun die Zeitverzögerung mithilfe einer JavaScript-Methode in meinen Diensten 22 00:01:24,820 --> 00:01:34,190 und aktualisiere dann auch die Komponenten, um dem Benutzer eine Nachricht mit der 23 00:01:34,190 --> 00:01:41,765 Spinnerkomponente des Angular Materialfortschritts anzeigen zu können, um eine sich drehende Scheibe in 24 00:01:41,765 --> 00:01:46,130 der Vorlagenansicht zu halten Sie den Benutzer über 25 00:01:46,130 --> 00:01:51,630 die Tatsache informiert, dass die Daten vom Server abgerufen werden, 26 00:01:51,630 --> 00:01:55,940 und wir werden in der Ansicht rendern, sobald die Daten für die 27 00:01:55,940 --> 00:02:00,590 Komponente verfügbar werden, wenn die Zusage aufgelöst wird. 28 00:02:00,590 --> 00:02:04,680 Mal sehen, wie wir das in dieser Übung tun können. 29 00:02:04,680 --> 00:02:09,110 Wieder, zurück zu meinem Dienst, 30 00:02:09,110 --> 00:02:11,990 hier habe ich den Geschirrservice hier geöffnet. 31 00:02:11,990 --> 00:02:15,490 Anstatt das Versprechen sofort 32 00:02:15,490 --> 00:02:18,620 zu lösen, werden wir nun ein Versprechen abgeben und dann 33 00:02:18,620 --> 00:02:22,500 das Versprechen nach kurzer Zeit lösen lassen. 34 00:02:22,500 --> 00:02:26,510 Also, um das zu tun, wird diese Versprechenserklärung nicht 35 00:02:26,510 --> 00:02:31,055 mehr funktionieren, wie hier gezeigt, also werde ich das löschen. 36 00:02:31,055 --> 00:02:34,535 Wenn meine Methode aufgerufen wird, gibt 37 00:02:34,535 --> 00:02:38,915 die Methode stattdessen ein Versprechen zurück, indem sie ein neues Versprechen erstellt. 38 00:02:38,915 --> 00:02:42,310 Sie erinnern sich, dass Sie, wenn Sie das neue Versprechen erstellt 39 00:02:42,310 --> 00:02:47,060 haben, innerhalb des Versprechens die Funktion 40 00:02:47,060 --> 00:02:52,795 mit Auflösen und Zurückweisen als die beiden Parameter haben würden. 41 00:02:52,795 --> 00:02:56,080 Jetzt werde ich nur den Auflösungsteil davon verwenden. 42 00:02:56,080 --> 00:03:02,665 Also, ich werde die Funktion innerhalb des Versprechens implementieren, nur mit einer Pfeilfunktion hier. 43 00:03:02,665 --> 00:03:04,690 Ich werde also „Resolution“ sagen, 44 00:03:04,690 --> 00:03:13,380 und ich werde eine kurze Verzögerung für diese Entschließung simulieren. 45 00:03:13,380 --> 00:03:17,340 Lassen Sie mich einen Kommentar schreiben. 46 00:03:17,440 --> 00:03:28,780 Simulieren Sie die Serverlatenz mit einer Verzögerung von zwei Sekunden. 47 00:03:28,780 --> 00:03:31,410 Also, wie simulieren wir das? 48 00:03:31,410 --> 00:03:37,380 Daher verwenden wir die setTimeout-Methode 49 00:03:37,380 --> 00:03:43,900 , die in JavaScript verfügbar ist. 50 00:03:43,900 --> 00:03:45,870 Also, für die setTimeout-Methode 51 00:03:45,870 --> 00:03:48,115 werde ich wieder eine Pfeilfunktion implementieren, 52 00:03:48,115 --> 00:03:52,625 die setTimeout-Methode hat keine Parameter, die wir dort benötigen. 53 00:03:52,625 --> 00:03:57,565 Also, wenn dieses setTimeout ausgeführt wird, 54 00:03:57,565 --> 00:04:04,245 dann wird es die Bereitstellung der DISHIELS auflösen. 55 00:04:04,245 --> 00:04:08,480 Also, lassen Sie mich diese Gerichte schneiden und dann fügen Sie sie in die DISCHELN. 56 00:04:08,480 --> 00:04:14,650 Sie sehen also, dass dieses Ergebnis jetzt das Ergebnis hier zurückgibt, 57 00:04:14,650 --> 00:04:22,370 und dieses Ergebnis wird nach zwei Sekunden Verzögerung hier zurückgegeben. 58 00:04:24,880 --> 00:04:31,160 Mit diesem Update wird unser Versprechen jetzt nach zwei Sekunden aufgelöst. 59 00:04:31,160 --> 00:04:37,010 Die in JavaScript verfügbare setTimeout-Methode simuliert daher eine kurze Verzögerung. 60 00:04:37,010 --> 00:04:38,710 Wie Sie sehen können, 61 00:04:38,710 --> 00:04:44,345 simuliert es die kurze Verzögerung und nimmt hier einen Rückruf ein. 62 00:04:44,345 --> 00:04:46,280 Dieser Callback, wie Sie sehen können, 63 00:04:46,280 --> 00:04:48,930 habe ich es hier als Pfeilfunktion implementiert. 64 00:04:48,930 --> 00:04:51,730 Also, keine Parameter und dann, wenn dies aufgelöst wird, 65 00:04:51,730 --> 00:05:01,450 wird es die Rückkehr der DISCHES und die Verzögerung für das ist zwei Sekunden zu lösen. 66 00:05:01,450 --> 00:05:04,185 Also, dieser Teil ist die Funktion, 67 00:05:04,185 --> 00:05:09,180 und das ist die Zeitverzögerung, die wir hier haben. 68 00:05:09,180 --> 00:05:14,590 Also, jetzt, mein Versprechen wird sich nach einer zwei-Sekunden-Verspätung lösen. 69 00:05:14,590 --> 00:05:19,870 In ähnlicher Weise aktualisieren wir die verbleibenden beiden Methoden hier. 70 00:05:20,720 --> 00:05:22,785 Also, um das zu tun, 71 00:05:22,785 --> 00:05:29,430 werde ich nur 72 00:05:29,430 --> 00:05:35,745 diesen Teil kopieren und dann einfach einfügen, 73 00:05:35,745 --> 00:05:41,325 und Sie würden bemerken, dass das 74 00:05:41,325 --> 00:05:51,315 wird und ich muss 2000 sagen. 75 00:05:51,315 --> 00:05:56,390 Damit wird die setTimeout-Methode dort abgeschlossen. 76 00:05:56,730 --> 00:06:00,445 Nun, wir werden 77 00:06:00,445 --> 00:06:09,705 die schließende Klammer folgen lassen. 78 00:06:09,705 --> 00:06:16,725 In ähnlicher Weise lassen Sie mich auch die letzte Methode aktualisieren. 79 00:06:16,725 --> 00:06:20,340 Also, Sie sehen, dass es die DISCHES auflöst, 80 00:06:20,340 --> 00:06:26,020 und dann nach zwei Sekunden Verzögerung, 81 00:06:29,270 --> 00:06:32,840 und schließen Sie die Methode, um dort. 82 00:06:32,840 --> 00:06:36,965 Das war's. Also, jetzt wird mein Geschirr-Service 83 00:06:36,965 --> 00:06:43,105 aktualisiert, um alle Versprechen nach zwei Sekunden Verzögerung zu lösen. 84 00:06:43,105 --> 00:06:47,810 Aktualisieren Sie nun auch den Leader-Service und 85 00:06:47,810 --> 00:06:52,405 den Promotion-Dienst nach dem gleichen Muster, wie ich Ihnen hier gezeigt habe. 86 00:06:52,405 --> 00:06:57,890 Der zweite Teil der Frage besteht darin, den Benutzer irgendwie darüber auf dem Laufenden zu halten 87 00:06:57,890 --> 00:07:03,260 , dass es eine zeitliche Verzögerung bei der Erlangung der Ergebnisse gibt, 88 00:07:03,260 --> 00:07:07,700 und so wird die Ansicht aktualisiert, sobald die Ergebnisse erhalten sind. 89 00:07:07,700 --> 00:07:10,690 Sie haben diese Art von Verhalten in vielen Anwendungen gesehen, 90 00:07:10,690 --> 00:07:18,020 einschließlich mobiler Anwendungen, bei denen Sie ein Spinner auf dem Bildschirm angezeigt haben, um 91 00:07:18,020 --> 00:07:21,620 den Benutzer darüber zu informieren, dass etwas von hinter 92 00:07:21,620 --> 00:07:25,445 den Kulissen geladen wird und wenn die Ergebnisse verfügbar sind, 93 00:07:25,445 --> 00:07:27,275 wird die Ansicht aktualisiert werden. 94 00:07:27,275 --> 00:07:33,750 Daher werden wir einen ähnlichen Ansatz innerhalb unserer Komponenten verwenden. 95 00:07:33,750 --> 00:07:35,530 Um uns dabei zu helfen, 96 00:07:35,530 --> 00:07:40,585 verwenden wir die Fortschrittsspinnerkomponente aus Angular Material. 97 00:07:40,585 --> 00:07:43,330 Also, um die Fortschrittsspinner-Komponente 98 00:07:43,330 --> 00:07:47,625 zu verwenden, gehen wir zuerst auf die app 99 00:07:47,625 --> 00:07:52,725 module.ts Datei und importieren dann das Fortschrittsspinner-Modul dort. 100 00:07:52,725 --> 00:07:55,180 Also, gehen Sie zu app module.ts. 101 00:07:55,180 --> 00:08:01,595 Wir werden zuerst hier gehen, um 102 00:08:01,595 --> 00:08:12,150 das MatProgressSpinnerModule aus Winkel/Material/Progress-Spinner zu importieren. 103 00:08:17,560 --> 00:08:23,025 Sobald wir dies in die Datei importiert haben, 104 00:08:23,025 --> 00:08:28,415 gehen wir in den NG-Modul-Dekorator in die Importe 105 00:08:28,415 --> 00:08:34,290 und fügen dann das MatProgressSpinnerModule hinzu. 106 00:08:34,290 --> 00:08:35,650 Sobald wir dies abgeschlossen 107 00:08:35,650 --> 00:08:42,075 haben, können wir die Komponenten aktualisieren, um den Fortschrittsspinner zu nutzen. 108 00:08:42,075 --> 00:08:45,970 Also hier werde ich Ihnen ein Beispiel zeigen, indem ich 109 00:08:45,970 --> 00:08:51,555 illustriere, wie wir die Menükomponente aktualisieren können, um diese Informationen anzuzeigen. 110 00:08:51,555 --> 00:08:55,505 Also, gehen Sie in die Menükomponenten-Layoutdatei. 111 00:08:55,505 --> 00:09:02,425 Hier sehen wir, dass wir das Menü mit der Rasterliste hier zeigen. 112 00:09:02,425 --> 00:09:06,880 Also, was wir tun werden, ist, für dieses div 113 00:09:06,880 --> 00:09:14,060 werde ich die nGIF-Direktive verwenden und sagen, dass dies angezeigt werden sollte. 114 00:09:14,060 --> 00:09:18,465 Das Menü sollte nur angezeigt werden, wenn Gerichte nicht null sind. 115 00:09:18,465 --> 00:09:23,670 Also zunächst, in Ihrer Komponenten-Tab-Skriptdatei, 116 00:09:23,670 --> 00:09:27,325 werden Sie sehen, dass, wenn Sie auf die Komponenten-Tab-Skriptdatei gehen, Sie werden sehen, dass 117 00:09:27,325 --> 00:09:32,250 Ihre Gerichte derzeit nur ein undefiniertes Objekt hier sind, 118 00:09:32,250 --> 00:09:39,255 und dass Gerichte dem Geschirr Wert nur zugewiesen werden, wenn die Probleme gelöst werden. 119 00:09:39,255 --> 00:09:40,995 Bis zu diesem Zeitpunkt 120 00:09:40,995 --> 00:09:43,145 werden die Gerichte ein undefinierter Wert sein. 121 00:09:43,145 --> 00:09:45,665 Also, wir können diese Tatsache nutzen 122 00:09:45,665 --> 00:09:49,270 und dann unsere Vorlage so neu gestalten, dass 123 00:09:49,270 --> 00:09:58,955 wir sagen würden, zeigen Sie dieses div nur, wenn das Geschirr kein undefiniertes oder kein Null-Objekt ist. 124 00:09:58,955 --> 00:10:01,970 Wenn es unbekannt ist, 125 00:10:01,970 --> 00:10:10,210 werde ich hier ein zweites div mit dem versteckten Attribut verwenden, das damit verbunden ist. 126 00:10:10,210 --> 00:10:14,310 Also, Sie haben gesehen, dass Versteckte verwendet werden. 127 00:10:14,310 --> 00:10:18,685 Also, ich werde das verwenden, um den Stamm zu definieren. 128 00:10:18,685 --> 00:10:23,350 Also, was das bedeutet, ist, dass, wenn Gerichte nicht null sind, 129 00:10:23,350 --> 00:10:25,145 dieses div versteckt wird. 130 00:10:25,145 --> 00:10:26,865 Wenn Gerichte null ist, 131 00:10:26,865 --> 00:10:28,405 dann wird dieses div angezeigt. 132 00:10:28,405 --> 00:10:31,435 Also, jetzt sehen Sie, dass Sie zwei divs hier haben. 133 00:10:31,435 --> 00:10:39,840 Der erste wird angezeigt, wenn das Geschirr nicht null Gericht Array ist. 134 00:10:39,840 --> 00:10:42,365 Andernfalls wird der zweite Teil angezeigt. 135 00:10:42,365 --> 00:10:46,120 Also, mit dieser kleinen Änderung meiner Vorlage, 136 00:10:46,120 --> 00:10:54,745 ich bin in der Lage, das Menü zu verstecken, bis zu dem Punkt, dass das Geschirr Array für mich verfügbar wird, 137 00:10:54,745 --> 00:10:57,350 und wenn das Geschirr Array verfügbar wird, 138 00:10:57,350 --> 00:10:58,660 dann werde ich das Menü zeigen. 139 00:10:58,660 --> 00:11:06,000 Bis dahin werde ich einen Mat-Spinner zeigen. Das 140 00:11:06,000 --> 00:11:11,295 Zahlenauswahlfeld „Fortschritt“ 141 00:11:11,295 --> 00:11:14,635 ist unbestimmt, das als Winkelmaterialkomponente verfügbar ist. 142 00:11:14,635 --> 00:11:20,565 Also, dies wird in meiner Ansicht als rotierender Kreis angezeigt, 143 00:11:20,565 --> 00:11:27,185 für diese Menükomponente bis zu dem Punkt, an dem die Ergebnisse erhalten werden, 144 00:11:27,185 --> 00:11:29,605 wenn die Probleme gelöst werden. 145 00:11:29,605 --> 00:11:35,330 Darüber hinaus werde ich auch h4 verwenden, und innerhalb der h4 146 00:11:35,330 --> 00:11:43,680 werde ich sagen, laden, bitte warten. 147 00:11:43,680 --> 00:11:48,205 Was passiert, ist, dass, wenn das Geschirr noch nicht aufgelöst ist, 148 00:11:48,205 --> 00:11:51,575 der Spinner und diese Nachricht auf dem Bildschirm angezeigt werden. 149 00:11:51,575 --> 00:11:55,210 In dem Moment, in dem das Geschirr verfügbar ist, wenn die versprochenen Ergebnisse, 150 00:11:55,210 --> 00:11:58,015 dann wird das Menü auf dem Bildschirm angezeigt. 151 00:11:58,015 --> 00:12:03,685 Jetzt werden wir ähnliche Aktualisierungen über die Komponente, 152 00:12:03,685 --> 00:12:07,985 die Home-Komponente und die Dish Detailkomponente auch durchführen. 153 00:12:07,985 --> 00:12:13,135 Entsprechend werden wir den Leader-Service 154 00:12:13,135 --> 00:12:18,570 und den Promotion-Dienst auch aktualisieren, um die Zeitverzögerung zu simulieren. 155 00:12:18,570 --> 00:12:22,000 Verwenden Sie also das Muster, das ich Ihnen gerade gezeigt habe, 156 00:12:22,000 --> 00:12:26,660 und aktualisieren Sie die Dienste und auch die entsprechenden Vorlagen, 157 00:12:26,660 --> 00:12:31,135 und wir werden das Ergebnis sehen, nachdem wir das Update abgeschlossen haben. 158 00:12:31,135 --> 00:12:34,710 Nachdem Sie die Updates aller Dienste und der 159 00:12:34,710 --> 00:12:38,255 entsprechenden Vorlagen für die Komponenten abgeschlossen haben, 160 00:12:38,255 --> 00:12:43,565 lassen Sie mich Sie hier schnell durch die aktualisierten Dateien führen. 161 00:12:43,565 --> 00:12:45,290 Also, das ist Führerdienst. 162 00:12:45,290 --> 00:12:47,320 Sie können also sehen, dass ich im Leader-Service die 163 00:12:47,320 --> 00:12:54,675 GetLeaders aktualisiert habe, um das SetTimeout genau so zu verwenden, wie wir es mit den Gerichten getan haben, 164 00:12:54,675 --> 00:12:58,880 und der GetLeader und der GetFeaturedLeader auch. 165 00:12:58,880 --> 00:13:01,650 In ähnlicher Weise 166 00:13:01,650 --> 00:13:08,190 haben wir im Promotion-Dienst die GetPromotions GetPromotion ID und die GetFeaturedPromotion aktualisiert. 167 00:13:08,190 --> 00:13:11,545 Daher werden die drei Dienste jetzt aktualisiert, 168 00:13:11,545 --> 00:13:15,955 um eine Zeitverzögerung zu verursachen, bevor sie das Ergebnis zurückgeben. 169 00:13:15,955 --> 00:13:18,325 Nun, in Bezug auf die Vorlagen, 170 00:13:18,325 --> 00:13:22,150 haben wir bereits die menu.component Vorlage aktualisiert. 171 00:13:22,150 --> 00:13:26,140 Schauen wir uns die home.components-Vorlagen an. 172 00:13:26,140 --> 00:13:27,985 Also, innerhalb der home.component, 173 00:13:27,985 --> 00:13:31,100 Sie erkennen, dass, als wir die home.component entworfen 174 00:13:31,100 --> 00:13:36,420 haben, wir die Karten bereits mit dem Stern nGIF-Gericht konfiguriert hatten. 175 00:13:36,420 --> 00:13:38,320 Also, alles, was wir tun müssen, ist, 176 00:13:38,320 --> 00:13:40,630 unten hier unten fügen wir ein div mit 177 00:13:40,630 --> 00:13:47,490 dem versteckten und Gericht hier, aber den Spinner, genau wie wir es mit dem Menü getan haben.component. 178 00:13:47,490 --> 00:13:53,265 In ähnlicher Weise hat die Mat-Karte für die Promotion bereits das NGIF an Ort und Stelle, 179 00:13:53,265 --> 00:14:00,530 also müssen wir nur dieses zusätzliche div hier mit der versteckten Promotion hinzufügen, 180 00:14:00,530 --> 00:14:05,015 und auch für den Führer hier unten. 181 00:14:05,015 --> 00:14:09,220 In ähnlicher Weise gehen Sie auf die Schüssel Detailkomponente. 182 00:14:09,220 --> 00:14:10,810 In der Gerichtendetailkomponente 183 00:14:10,810 --> 00:14:17,105 hatten wir bereits die Liste mit dem NGIF-Gericht für die Kommentare. 184 00:14:17,105 --> 00:14:23,250 Auch das NGIF-Gericht für die Karte, die die Details des Gerichts anzeigt. 185 00:14:23,250 --> 00:14:30,440 Also, alles, was wir tun müssen, ist in diesem neuen div mit dem versteckten Gericht hier 186 00:14:30,440 --> 00:14:32,970 und dem div Spinner an Ort und Stelle hinzuzufügen. 187 00:14:32,970 --> 00:14:36,295 In ähnlicher Weise, in der über Komponente, 188 00:14:36,295 --> 00:14:39,015 wenn Sie in die über Komponente gehen, 189 00:14:39,015 --> 00:14:42,515 würden Sie sehen, dass wir die Unternehmensführer hier hatten, 190 00:14:42,515 --> 00:14:47,330 und wir hatten bereits die Liste mit dem Star NGIF mit Führungskräften. 191 00:14:47,330 --> 00:14:50,950 Also, alles, was wir tun müssen, ist in das div mit 192 00:14:50,950 --> 00:14:55,715 versteckten und Führern hier mit einem Spinner an Ort und Stelle hinzuzufügen. Das war's. 193 00:14:55,715 --> 00:14:58,155 Unsere Anwendung ist jetzt aktualisiert. 194 00:14:58,155 --> 00:15:04,665 Werfen wir einen Blick auf die aktualisierte Anwendung im Browser als nächstes. Wenn Sie 195 00:15:04,665 --> 00:15:06,530 zum Browser gehen, 196 00:15:06,530 --> 00:15:10,275 werden Sie sehen, dass, wenn Sie versuchen, die Home-Komponente zu laden, 197 00:15:10,275 --> 00:15:14,520 es eine kurze Zeit gibt, in der Sie den Spinner auf 198 00:15:14,520 --> 00:15:18,730 dem Bildschirm sehen, bevor die Karten geladen werden. 199 00:15:18,730 --> 00:15:21,520 In ähnlicher Weise, wenn Sie zum Menü gehen. Komponente, 200 00:15:21,520 --> 00:15:24,765 würden Sie den Spinner auf der linken Seite für 201 00:15:24,765 --> 00:15:28,995 zwei Sekunden sehen, bevor das eigentliche Menü aktualisiert wird, 202 00:15:28,995 --> 00:15:33,395 und wenn Sie zu einem einzelnen Gericht gehen, sehen Sie auch, dass 203 00:15:33,395 --> 00:15:38,505 der Spinner auf dem Bildschirm, bevor die Details des Gerichts gerendert werden, 204 00:15:38,505 --> 00:15:42,500 und in der über Komponente auch ähnlich, werden Sie sehen, dass 205 00:15:42,500 --> 00:15:50,400 Sie den drehenden Kreis dort haben, bevor die Informationen der Führungslinie aktualisiert werden. 206 00:15:50,400 --> 00:15:53,520 Jedes Mal, wenn wir zu einem dieser gehen, 207 00:15:53,520 --> 00:16:02,190 würden Sie eine ähnliche kurze Verzögerung sehen, bevor die Entzündung auf dem Bildschirm aktualisiert wird. 208 00:16:04,030 --> 00:16:12,860 Damit sehen Sie, wie Sie mit Verzögerungen beim Erhalten der Ergebnisse umgehen können, 209 00:16:12,860 --> 00:16:18,874 oder Verzögerung bei der Auflösung des Versprechens von der Service-Seite innerhalb Ihrer Komponente 210 00:16:18,874 --> 00:16:21,830 und halten Sie den Benutzer über die Tatsache, dass es 211 00:16:21,830 --> 00:16:25,495 eine kurze Verzögerung, bevor der Bildschirm aktualisiert wird, informiert. 212 00:16:25,495 --> 00:16:28,260 Damit ist diese Übung abgeschlossen. 213 00:16:28,260 --> 00:16:35,420 In dieser Übung haben wir gesehen, wie wir eine kurze Verzögerung mit unseren Versprechen simulieren können. Wir haben uns 214 00:16:35,420 --> 00:16:38,575 von den Diensten gelöst, 215 00:16:38,575 --> 00:16:45,185 und wir haben auch gesehen, wie Sie den Benutzer auf dem Laufenden halten können, indem Sie die MD-Spinner 216 00:16:45,185 --> 00:16:49,460 Winkelmaterialkomponenten verwenden, um auf 217 00:16:49,460 --> 00:16:53,900 dem Bildschirm für die Dauer anzuzeigen, wenn die Ergebnisse noch nicht verfügbar sind, 218 00:16:53,900 --> 00:16:59,025 dh für die Dauer, bis das Versprechen gelöst wird. 219 00:16:59,025 --> 00:17:01,470 Damit ist diese Übung abgeschlossen. 220 00:17:01,470 --> 00:17:07,770 Dies ist ein guter Zeitpunkt für Sie, ein Git-Commit mit dem Nachrichtenversprechen Teil zwei zu machen.