Я пытаюсь использовать спиннер в своем приложении, потому что есть много данных, которые требуют времени для загрузки. Но вот в чем проблема. Я взял эту ссылку в качестве ссылки -
Экран загрузки Pre-Bootstrap для Angular2
и
для реализации блесны в angular2 +
В показанной выше статье они упомянули, что использование или (или, возможно, также) Angular автоматически заменит «Загрузка ...» на реальное содержимое после загрузки Angular. Однако это не относится к моей программе.
Пожалуйста, проверьте мой код и руководство соответственно.
Error
Argument of type '{ selector: string; 'my-app': any; templateUrl:
string; styleUrls: string[]; }' is not assignable to parameter of
type 'Component'.
Object literal may only specify known properties, and ''my-app''
does not exist in type 'Component'.
transaction.component.html
<table>
<thead> ....
</thead>
<my-app>
<div class="loaded" *ngIf="loaded">
<div class="text-center">
<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
<div> Data Waiting To Be Loaded </div>
</div>
</div>
</my-app>
<tbody>
.....
</tbody>
<table>
transaction.component.ts
@Component({
selector: 'app-transaction','my-app',
templateUrl: './transaction.component.html',
styleUrls:
['./transaction.component.scss',]
})
export class TransactionComponent implements OnInit {
public loaded=false;
ngOnInit() {
this.loaded=true;
}
insideSearchByText(filterObj) {
this.http.post("http://" + url + ":" + port +
.....
.map(result => this.result = result.json(),
this.loaded=false)
....
}});
}
transaction.component.scss
.loaded {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}