2016-03-18 6 views
0

どのように私はangular2とobservablesとisotope jquety libを使用できますか?私はサーバーからデータを取得するときにアイソトープを適用したい。今の私が持っている:同位体2角形

import {Component} from "angular2/core"; 
import {Heroes} from "./heroes"; 
import {ApiclientService} from "./apiclient.service"; 

@Component({ 
    templateUrl: 'heroes-list.html', 
    providers: [ApiclientService] 
}) 

export class HeroesComponent { 

    public Heroes: Heroes[] = []; 

    constructor(private _apiclientService: ApiclientService) { 
     this.getHeroes(); 
    } 

    getHeroes() { 
     this._apiclientService.getHeroes() 
       .subscribe(
        heroes => this.heroes = heroes, 
        error => this.errorMessage = <any>error); 


    } 

    ngAfterViewInit() { 
     $(document).ready(function() { 
      $('.heroes-grid').isotope({ 
       itemSelector: '.heroes-item' 
      }); 
     }); 
    } 
} 

このdoesntの仕事をjqueryのは、いくつかのデータを返しているサブスクライブ観察可能な方法の前に解決されているため。もし観測可能なものが解決された後にアイソトープと呼ぶならば、成功しないでしょう。この種の状況に接近する最善の方法は何か。 jqueryプラグインとobservablesを結合するには?

答えて

0

この問題にまだ取り組んでいない場合は、すべてのイメージがロードされていることを確認するためにonreadyドキュメントではなく、アイソトープの初期化をonLoadイベントウィンドウにバインドする必要があります。ハンドラをサブスクライブ英雄サービスにも

は、おそらく新しい要素の同位体コンテナに認識させるために、同位体のinsertメソッドを呼び出す必要があります:

var newItems = $('.blog-masonry-item'); 
$('.blog-masonry-container').isotope('insert', newItems); 
関連する問題