Angular 2具有相同选择器的多个组件
发布时间:2020-12-17 17:06:54 所属栏目:安全 来源:网络整理
导读:如何处理两个组件使用相同选择器的以下情况? (删除“组件”一词以避免混乱): app.ts import { Component } from '@angular/core';import { Person as Person1 } from './person1';import { Person as Person2 } from './person2';@Component({ selector: '
如何处理两个组件使用相同选择器的以下情况? (删除“组件”一词以避免混乱):
app.ts import { Component } from '@angular/core'; import { Person as Person1 } from './person1'; import { Person as Person2 } from './person2'; @Component({ selector: 'app',template: '<person1???></person1><person2???></person2>',directives: [Person1,Person2] }) export class App { } person1.ts import { Component } from '@angular/core'; @Component({ selector: 'person',template: '<h1>Person 1</h1>' }) export class Person { } person2.ts import { Component } from '@angular/core'; @Component({ selector: 'person',template: '<h1>Person 2</h1>' }) export class Person { } 这不是React的问题,因为你只使用< Person1 />和< Person2 /> 解决方法
基于GünterZ?chbauer评论,你可以添加一堆样板来完成这个并包装组件:
app.ts import { Component } from '@angular/core'; import { Person as Person1 } from './person1'; import { Person as Person2 } from './person2'; @Component({ selector: 'person1',template: '<person></person>',directives: [Person1] }) export class Person1Wrapper { } @Component({ selector: 'person2',directives: [Person2] }) export class Person2Wrapper { } @Component({ selector: 'app',template: '<person1></person1><person2></person2>',directives: [Person1Wrapper,Person2Wrapper] }) export class App { } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |