相关疑难解决方法(0)

有没有sleep比使用以下pausecomp函数更好的方法来设计JavaScript (从这里开始)？

function pausecomp(millis)
{
    var date = new Date();
    var curDate = null;
    do { curDate = new Date(); }
    while(curDate-date < millis);
}

这不是JavaScript中Sleep的重复- 动作之间的延迟 ; 我希望在函数中间实现真正的睡眠,而不是在执行代码之前的延迟.

我有一个组件从服务器获取项目列表,然后使用模板中的*ngFor显示该列表.

我希望列表显示一些动画,但一个接一个.我的意思是每个列表项应该在其他之后动画.

我正在尝试这样的事情:

import { Component, Input, trigger, state, animate, transition, style } from '@angular/core';

@Component({
    selector: 'list-item',
    template: ` <li  @flyInOut="'in'">{{item}}</li>`,
    animations: [
        trigger('flyInOut', [
            state('in', style({ transform: 'translateX(0)' })),
            transition('void => *', [
                style({ transform: 'translateX(-100%)' }),
                animate(100)
            ]),
            transition('* => void', [
                animate(100, style({ transform: 'translateX(100%)' }))
            ])
        ])
    ]
})
export class ListItemComponent {
    @Input() item: any;
}

在我的列表组件模板中我使用它像:

<ul>
    <li *ngFor="let item of list;">
     <list-item [item]="item"></list-item>
    </li>
</ul>

它的作用是立即显示整个列表.我希望项目一个接一个地输入一些动画.

我一直在挖掘Angular2文档,似乎没有一种简单的方法来为动画添加延迟.作为参考,这是我的目标:使用jQuery的plunkr

我想使用Angular2的动画功能,因为这些"条"是在循环中生成的.他们的动画效果很好,但是一下子.我想以1s为增量错开它们.这是我的主要组件文件:

import {
  Component,
  Input,
  trigger,
  state,
  style,
  transition,
  animate
} from '@angular/core';


export class Skill {
  skill: string;
  level: number;
}

const SKILLS: Skill[] = [
    { skill: 'x', level: 70 },
    { skill: 'y', level: 100 },
    { skill: 'z', level: 80 }
]

@Component({
  selector: 'app-wrap',
  template: `
    <div *ngFor="let skill of skills; let i = index" class="skill">
      <span class="bar" [style.width.%]="skill.level" [@expandSkill]>&nbsp;</span>
    </div>
  `,
  animations: [
    trigger('expandSkill', [
      state('in', style({ width: 'auto' })),
      transition('void => …