Question

我想做这样的事情。当组件加载然后在1秒后加载它的html。这是代码组件（ts）。

import { Component } from '@angular/core';

@Component({
   selector: 'pagination',
   templateUrl: './app/html/pagination.component.html',
   styleUrls: ['app/css/pagination.component.css']
})

export class Pagination {}

我们在代码templateUrl: './app/html/pagination.component.html',中看到它如何在1秒后加载？一般来说，我的想法包括在服务器上执行post post请求时为用户显示加载延迟（1秒）。有什么想法吗？

Answer 1

尝试使用ngIf指令。

所以它看起来像这样：

<div *ngIf="showContent">Will appear after ~1 sec</div>

在组件代码中：

export class Pagination {
    public showContent: boolean = false;
    public ngOnInit() {
      setTimeout(()=>this.showContent=true, 1000);
    }

}

Answer 2

基本上你想要的只是在请求完成后显示组件，为了实现这一点，只需订阅你的请求并设置一个标志来显示模板中的组件：

  $(document).ready(function(){
    $('.tooltipped').tooltip({delay: 50, tooltip: 'some text', html: true});
  });

在组件的类中：

<div *ngIf="loaded">
...
...
...
</div>

根据您的要求：

@Component....
export class FooComponent{
    let loaded = false;
}

angular.io

的更多信息

延迟组件的html角度2

2 个答案: