typescript - Angular 2 : Inject external Component into other component via directive not working

标签 typescript ionic-framework angular ionic2

我想让子组件模板加载到父组件模板中。 (由于缺乏更好的措辞,我称他们为 child 和 parent )

这是我的 child :

import {Component,Directive, ElementRef, Input} from '@angular/core';
import {IONIC_DIRECTIVES} from 'ionic-angular';


@Component({ 
  selector: '[parentselector]',
  template: '<div>I AM A CHILD</div>',
  directives: [IONIC_DIRECTIVES] 
})


export class ChildPage {
    constructor() {

    }
}

这是我的 parent :

@Component({
    templateUrl: 'build/pages/parent/parent.html',
    directives: [ChildPage]
})

以及父级的 HTML:

<ion-content>
    <ion-slides>
        <ion-slide><parentselector>Parent To Be Overriden</parentselector>
        </ion-slide>
    </ion-slides>
</ion-content>

知道哪里出了问题吗?

最佳答案

来自Angular 2 Cheat Sheet (搜索选择器)它说通过使用括号你限制了你的指令可以被调用的地方。例如:

selector:'[parentselector]' - means you can only select as an attribute
selector:'parentselector' - means you can only select as an element
selector:'.parentselector' - means you can only select as a css class

因此,如果您取下 [] 一切都应该很好

关于typescript - Angular 2 : Inject external Component into other component via directive not working,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38236313/

相关文章:

ionic-framework - ionic serve 显示多个地址,我选错了一个...如何更改 ionic serve 使用的地址?

typescript - TypeScript 中的双等号 (==)

javascript - 我可以在 mat-expanded 行中显示另一个表格吗?

node.js - 无法通过Kubernetes上的Node.Js连接到Elasticsearch(证书链中的自签名证书)

typescript - 无法从 Vue.js 中的方法访问数据(使用 Ionic)

javascript - ionic 服务后找不到模块(webpack)/hot/emitter @angular-devkit/build-angular - Ionic 4

javascript - React 详细信息列表始终为空

Angular 2 : Shared component thats used for routing

angular - *ngFor 没有按预期销毁组件

javascript - http请求前的数据过滤完全