2017-01-29 22 views
1

を更新し、ここで問題に直面します。私のプロジェクトにjsファイルをロードするAPIがあります。問題は、私はこのjsファイルを使用する必要があり、それを変更するための私のコントロールではありません、基本的に、このjsファイルはAJAX経由でAPIを呼び出し、配列を返すいくつかのメソッドがあります。 私が必要とするのは、データが入ってくるとすぐにビューを更新することです。多くの方法で試してみましたが、それでもうまくいきません。任意のアイデアをどのようにバインドしてビューを更新できますか?角度2のビューを更新します。角度2の新しい角度

import {Component, AfterContentInit} from "@angular/core"; 
 
import {IProduct} from "./product"; 
 
import {ProductService} from "./product.service"; 
 
declare var ExpressLibraryLoader: any; 
 
@Component({ 
 
    selector: 'pm-products', 
 
    moduleId: module.id, 
 
    templateUrl: 'product-list.component.html', 
 
    styleUrls: ['product-list.component.css'] 
 
}) 
 
export class ProductListComponent implements AfterContentInit{ 
 
    pageTitle: string = 'Product List'; 
 
    listFilter: string = ''; 
 
    products = []; 
 
    errorMessage: string; 
 

 
    constructor(private _productService: ProductService) { 
 
    } 
 

 
    ngAfterContentInit(): void{ 
 
     //this._productService.getProducts(). 
 
      // subscribe(products => this.products = products, error => this.errorMessage = <any>error); 
 

 
     ExpressLibraryLoader.initialise({ 
 
      platformKey: 'xxx', 
 
      brandID: 20, 
 
      libraryUrl: "http://localhost/xxxxcx/", 
 
      domainLaunchUrl: "http://localhost/xcxcxc/", 
 
      success: function (ExpressLibrary) { 
 
       let parameters = 
 
        { 
 
         languageCode: 'en', 
 
         gameProviderID: [7], 
 
         success: function (response) { 
 

 
          if (response.Status === "Success") { 
 

 
           //response.Result.Games.map(response => this.products = response); 
 
           this.products = response.Result.Games; 
 
           console.log(this.products) 
 
          } else { 
 

 
          } 
 
         }, 
 
         error: function() { 
 
         } 
 
        }; 
 
       ExpressLibrary.games.getDesktop(parameters); 
 
      } 
 
     }); 
 
    } 
 

 
}

+0

おそらくngZoneを探しています。ここで試してみてください:http://stackoverflow.com/questions/34592857/view-is-not-updated-on-change-in-angular2?rq=1 –

答えて

0

あなたは矢印の機能を使用する必要があるように、this参照はあなたのクラスのインスタンスを指していないルックス:

success: function (ExpressLibrary) { ... } 
//change to 
success: (ExpressLibrary) => { ... } 
// or, quite funny you mentioned it 
success: function (ExpressLibrary) { ... }.bind(this) 
+0

それは残念なことに動作しませんでした。ゾーンで試してみましたが、運がまだありません。 –

0

私はそれがthisでいるようだ、問題を発見

success: function (response) { 
      if (response.Status === "Success") { 
      this.products = response.Result.Games; 
      console.log(this.products) 
      } } 

のスコープは異なります。だから、解決策は明らかであり、簡単です:

var that = this; 

    var parameters = 
      { 
       //various parameters 
       success: function(response){ 
       if (response.Status === "Success") { 
        that.products = response.Result.Games; 
       } 
       }, 
       error: function() { 

       } 
      }; 
     ExpressLibrary.games.getDesktop(parameters);