スピナーを持つコンポーネントがあり、app.component.htmlに配置されています
<app-spinner *ngIf="isLoading"></app-spinner>
app.component.tsで、isLoadingをFalseに設定して始めました。
次に、getDataなどのメソッドを含むサービスがあります。
getData() {
// show spinner
this.http.get('url here');
// Hide Spinner
}
私の質問は...スピナーがapp.component.htmlと.tsにあり、それを表示および非表示にする変数がある場合...他のコンポーネントまたはアプリに存在するサービスからその値を変更する方法。 component.ts、これを行うより良い方法がない限り?
回答 2 件
app.component.tsのサービスメソッドをサブスクライブし、次の場合にisLoadingブール値を設定します。申し込む サービスのgetData()メソッドの応答に対して。
getDataFromService() { // show spinner whilst waiting for the request this.isLoading = true; this.yourServiceName.getData() .subscribe(res => { // Hide spinner when res is received this.isLoading = false; // do something with the repsonse console.log(res); }); }
関連記事
- Angular Formコントロールは、コンポーネントの初期化では無効であり、アクションはありません
- Angular 6:コンポーネントからサービスにオブジェクトを渡す
- AngularサービスでのHTTPリクエストの連鎖
- 各ステップに個別のコンポーネントを備えたAngularMaterial Stepper:ExpressionChangedAfterItHasBeenCheckedError
- 子コンポーネントAngularでpropが定義されていないのはなぜですか?
- 外部APIを呼び出すこのAngularサービスメソッドからPromiseをどの程度正しく返すのですか?
- Angularのコンポーネントが表示されないのはなぜですか?
- AngularでコンポーネントをロードするためにFirestoreのデータを返さないリゾルバー
- 親コンポーネントがAngularルーターに隠れない
- 入力が原因で、角度ユニットテストのモック化されたHttpgetサービスリクエストが失敗する
関連した質問
- このHTTP応答からオブジェクトのプロパティを取得する方法
- 遅延読み込みモジュールでサブコンポーネントを使用する
- サファリモバイルとiOSアプリのライフサイクルフックが機能しない
- ネストフィルターは問題ありません
- 元のサービスオブジェクトでも代替のサービスオブジェクトを変更する
- さまざまなコンポーネントからの角度イベント
- コンポーネントからのNGRXシークシャルコールアクション
- オブジェクトから異なるプロパティを取得する方法は?
- 「すべて選択」を選択すると、angular2-multiselect-dropdownでonDeSelectAllイベントも発行されます。
- Observable TextArea defaultValueは、sendMessage SignalR&Typescript/angularの後の空白です
使用する件名 またはBehaviorSubject サービス内で、コンポーネントの同じサブスクライブメソッドを使用して、最新の値を取得します。
service.tsファイル
.component.ts