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组件未显示

回答

相关问题