Angular2 mouseover或mouseleave会导致应用程序的绑定刷新

Question

所以我使用angular2 RC4，当我绑定这些事件时，页面上的所有元素绑定都会刷新，这很烦人b / c我有从头开始重新启动的视频内容。我没有在其他任何地方看到这个问题，所以我可能做错了。

＆＃13;

＆＃13;

//FrontPage
import template from './FrontPage.html';

@Component({
  selector: 'front-page',
  template,
  directives: [VideosDisplay_New, VideosDisplay_Watch, VideosDisplay_Complete, NavBar, StickyPos, SideBarRight, Carousel, ModalDirective]
})
export class FrontPage {
  
    public clButton : CLButton;
    
    @ViewChild('episodeModal') episodeModal: ModalDirective;
    public clickedEpisodeModal : OuNeRe;
    @ViewChild('seriesModal') seriesModal: ModalDirective;
    public clickedSeriesModal : ThCoMe_OuSe;
    
    constructor (){
       
        this.clButton = CLButton;      
    }

    public navBool : boolean = false;
    public sidebarTop : number = 55;
    public navStyle : string = 'relative';
    
    
    public navExpand() : void{
        this.sidebarTop = 55;
        this.navBool = false;
        this.navStyle = 'relative';
    };

    public navCollapse() : void {
        this.sidebarTop = 10;
        this.navBool = true;       
        this.navStyle = 'absolute';
    };
}

//Carousel
import template from './Carousel.html';

@Component({
  selector: 'carousel',
  template,
  directives: [CollapseDirective, TOOLTIP_DIRECTIVES, CElement, CElementVideos]
})
export class Carousel implements OnInit{
    
    private currentIndex = 0;
    private skip : number = 0;
    private ouFe : OuFe;
    private results : StdSequence ;
    public ces : any[] = [];
    
    public constructor (ouFe : OuFe) {
        this.ouFe = ouFe;
    }
    
    ngOnInit () {
        
        this.results = this.query(0);   
        
        this.results.observeChanges({
            addedBefore :function(id, fields, before){
                this.results = this.ouFe.fFind({},{limit:6});
            }.bind(this)    
        });
    }
      
    query (skip : number) : StdSequence {
        return this.ouFe.fFind({},{'skip':skip, limit:6});    
    }
}

//CElementVideos
import template from './CElementVideos.html';

@Component({
  selector: 'celement-videos',
  template,
  directives: [CollapseDirective, TOOLTIP_DIRECTIVES]
})

export class CElementVideos {
    
    @Input() src : string = "";
    @Input() caption : string = "NA";
    
    public constructor (){
    }
}

＆＃13;

<!-- front page html view -->

<div class="container-fluid">
	<div class="row fixed-nav" 
 		(mouseover)="navExpand();" 
		(mouseleave)="navCollapse();"
		[ngStyle]="{'position': navStyle}">
		<nav-bar  class="col-md-12"></nav-bar>
	</div>
    <!-- video content -->
  	<div class="row content-bottom-space">
		<carousel></carousel>
	</div>
</div>


<!-- video container view, Carousel.html -->
<div class="container-fluid">
	<div class="row absolute-parent">	
		<div *ngFor="let ce of results; let i = index">
			<celement-videos *ngIf="ce.fDocumentTypes()[1] == 'Videos'" [src]="ce.fGetVideo(0)" [caption]="ce.fTitle()" class="col-sm-2"></celement-videos>
		</div>
    </div>
</div>

<!-- video component view, CElementVideos.html-->
<div>
	<video [autoplay]="true" [muted]="true" controls>
		<source [src]="src" type="video/webm">
		<source [src]="src" type="video/mp4">
		<source [src]="src" type="video/ogg">
		Your browser does not support the video tag.
	</video>

</div>

＆＃13;

＆＃13;

＆＃13;

鼠标事件是怎么回事？