傳統流星方法angular2 UI路由器問題

https://github.com/faizmh/meteor_angular2_router_issues 傳統流星方法angular2 UI路由器問題

我試圖從導航主頁市場頁面。

在主頁上，我嘗試了不同的變化過渡到市場頁面

我的目標市場頁面上，從通過觀測量

使用流星RPC方法在傳統的情況下，數據庫讀取帳戶包和流星方法中，所述角UI未能呈現數據

home.component.html

home page 
<a [routerLink]="['/market']"> Market</a> 
<button (click)="direct()">Direct Router</button> 
<button (click)="accounts_package()">Using meteor accounts_package</button> 
<button (click)="meteor_methods()">Using meteor Methods</button> 
<button (click)="meteor_observable()">Using meteor meteor_observable</button>

個

home.component.ts

import { Component} from '@angular/core'; 
import template from './home.component.html'; 
import { Router, CanActivate } from '@angular/router'; 
import { Injectable } from '@angular/core'; 
import { MeteorObservable } from 'meteor-rxjs'; 
import { Meteor } from 'meteor/meteor'; 

@Component({ 
    selector: 'home', 
    template 
}) 
@Injectable() 
export class HomeComponent { 
    constructor(private router:Router){ 
    } 
    direct(): void { 
     console.log('calling direct') 
     this.router.navigate(['market']); 
     console.log(this.router) 
    } 

    meteor_observable(): void {  
     console.log('calling meteor_observable') 
     let router = this.router 
     MeteorObservable.call('logout').subscribe((markets) => { 
     router.navigate(['market']); 
    }, (error) => { 
     console.log(`Failed to receive market_filter due to ${error}`); 
    }); 
    } 
    accounts_package(): void { 
     console.log('calling accounts_package') 
     let router = this.router 
     Meteor.logout(function(){  
     router.navigate(['market']); 
     }); 
    } 

    meteor_methods(): void { 
     console.log('calling meteor_methods') 
     Meteor.call('logout', (error,result) => { 
      this.router.navigate(['market']); 
     }) 
    } 
}

market.component.ts

import { Component} from '@angular/core'; 

import template from './market.component.html'; 
import { MeteorObservable } from 'meteor-rxjs'; 
import { Meteor } from 'meteor/meteor'; 

@Component({ 
    selector: 'market', 
    template, 
}) 
export class MarketComponent { 
    private markets 

    constructor() { 
    MeteorObservable.call('market_filter').subscribe((markets) => { 
     this.markets = markets 
    }, (error) => { 
     console.log(`Failed to receive market_filter due to ${error}`); 
    }); 

    } 
}

market.component.html

Markets are {{markets}}

來源

2016-12-12 Faiz Mohamed Haneef

我們需要更多的代碼。顯示有效的代碼是沒有用的。告訴我們你的路線，甚至可能是模板。 – Mikkel

其實這裏主要PROBL時間是我們正在使用角2和流星在一起，兩者都在不同的區域。所以角度不會檢測到其區域外的變化。您可以使用此方法解決此問題。

import { NgZone } from '@angular/core';

在你構造類型使用本

constructor(private ngZone: NgZone) {}

，並使用ngZone這樣你想要的角度

generate_head_list_data(){ 
     var self = this; 
     Meteor.call('refresh_graph_list', self.all_csvdata, self.newGraphdata, (error, response) => { 
       if (error) { 
        console.log(error.reason); 
        self.ngZone.run(() => { <-- put you code inside ngZone in which you are getting issue in rendering 
         self.processingStart = false; 
        }); 
       } else { 
        self.ngZone.run(() => { 
         self.processingStart = false; 
         self._router.navigate(['/login']); 
        }); 
        console.log(response); 
       } 
      }); 
    }

我希望這將有助於檢測哪些值。

來源

2016-12-25 19:27:42

傳統流星方法angular2 UI路由器問題

回答

相關問題