Angular 2組件未顯示

我試圖在我的GettingStartedPage組件中顯示OAuthComponent。在投放到我的瀏覽器時，OAuthComponent未顯示。沒有錯誤。Angular 2組件未顯示

OAuthComponent.ts 

import {Page, NavController} from 'ionic/ionic'; 
import {Component} from 'angular2/angular2' 

@Component({ 
    templateUrl: "app/authentication/components/oauth-component.html", 
    selector: "oauth-component" 
}) 
export class OAuthComponent { 

    private nav: NavController; 

    constructor(nav: NavController) { 
     this.nav = nav; 
    } 
}

oauth-component.html 

<h1> 
    Testing Something 
</h1>

GettingStartedPage.ts 

import {Page, NavController} from 'ionic/ionic'; 
import {OAuthComponent} from "../authentication/components/OAuthComponent"; 
import "./getting-started.scss"; 

@Page({ 
    templateUrl: 'app/getting-started/getting-started.html', 
    directives: [OAuthComponent] 
}) 
export class GettingStartedPage { 

    private nav: NavController; 

    constructor(nav: NavController) { 
     this.nav = nav; 
    } 
}

getting-started.html 

<ion-navbar *navbar> 
    <a menu-toggle> 
     <icon menu></icon> 
    </a> 

    <ion-title>Getting Started</ion-title> 
</ion-navbar> 

<ion-content> 
    <main> 
     <oauth-component></oauth-component> 
    </main> 
</ion-content>

來源

2015-12-01 prolink007

在Angular2所有組件必須引用顯示在視圖中的其它組分。

Ionic似乎用自己的@Page註釋來處理這個問題，但它只包含離子特定組件。 decorators.ts解釋了這種行爲。

你需要編輯你的代碼，包括OAuthComponent在directives：

@Page({ 
    templateUrl: 'app/getting-started/getting-started.html', 
    directives: [OAuthComponent] // Don't forget to import it 
}) 
export class GettingStartedPage {

來源

2015-12-01 23:59:08

新增'指令：[OAuthComponent]'和導入。它仍然沒有工作。修改我原來的帖子以包含指令更改。 – prolink007

目前，我有同樣的問題。它與jQuery有關。如果你使用jQuery代碼，你應該檢查並修復它們。但我不知道如何完全修復它！

更多詳細信息：我的問題是，我使用.append()函數來動態地（在我的組件後面）添加一些東西到我的標記中，但它會導致組件發生故障。也許一個解決方案是使用.appendTo()函數，而不是（它幫助我）。如果您想確定問題出在jQuery上，請嘗試逐個刪除它們以查找問題。

來源

2017-09-22 10:42:09 MAChitgarha

Angular 2組件未顯示

回答

相關問題