V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
musicq
V2EX  ›  Angular

求教 Angular2 怎样使用动画

  •  
  •   musicq · 2016-03-24 10:47:52 +08:00 · 3311 次点击
    这是一个创建于 3159 天前的主题,其中的信息可能已经有所发展或是发生改变。

    angular2 怎样使用动画模块

    import {Component,ElementRef,Renderer} from 'angular2/core';
    import {AnimationBuilder} from 'angular2/animate';
    
    @Component({
        selector: 'app-animate',
        templateUrl: `
          <h1 #h1>hello</h1>
          <button (click)="start(h1,button)" #button>开始动画</button>
        `,
        providers: [AnimationBuilder]
    })
    
    export class AnimateComponent {
    
        constructor(public _animationBuilder:AnimationBuilder,
                    public _renderer:Renderer) {
    
        }
    
        start(h1:HTMLElement, button:HTMLElement) {
    
            let origText = button.innerHTML;
    
            this._renderer.setText(button, '动画中..');
    
            this._animationBuilder
                .css()
                .addClass('animated')
                .setDuration(5000)
                .addAnimationClass('bounce')
                .start(h1)
                .onComplete(() => {
                    this._renderer.setText(button, origText);
                });
        }
    }
    

    网上看的这个例子一直报错,就是 providers 这个属性造成的,如果去掉就不会有报错,所以应该怎样写,求教大神!!!!

    1 条回复    2016-03-24 11:36:10 +08:00
    musicq
        1
    musicq  
    OP
       2016-03-24 11:36:10 +08:00
    折腾一上午,终于找到解决方案了!!!真捉急
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2833 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 19ms · UTC 08:32 · PVG 16:32 · LAX 00:32 · JFK 03:32
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.