由于它不是'y'的已知属性，因此无法绑定到'x'

Question

我有一个包含另一个组件内部组件的角网站。我正在使用路由和延迟加载外部组件（ComponentA）。内部组件（ComponentB）依赖于第三方指令。

以下是PoC：https://plnkr.co/edit/7maVz2vO9LKTli47hyWl?p=info（打开控制台查看错误）。

在ComponentB中使用第三方指令时出现错误。这不是指令本身的错误，而是我如何构建代码的错误。

<tree-root [nodes]="nodes"></tree-root> 

不能绑定到“节点”，因为它是不是“树根”已知属性

我可以通过导入第三方模块解决这个问题ComponentA，但是由于ComponentA不依赖于这个模块，所以这样做感觉不对。

我创建的Plunker是我的应用程序的一小部分，旨在隔离此问题。这是为了展示一个概念，而不是作为一个应用程序的意义。我想要实现的是创建一个可以添加到我的任何页面的组件。该组件可以是一个小部件或其他东西，添加到一个或多个父页面。它是独立的。

我对Angular的有限知识已经开始在这里展示。由于组件应该允许我们执行基于组件的开发，将我们的应用程序分解为更小的部分，我不明白为什么ComponentA需要知道ComponentB具有哪些依赖关系才能在其视图中使用它。

我还会证明这只是一个问题，因为我在ComponentB中包含第三方指令。如果我删除该指令，所有作品。例如，如果我做了这样的代替：

<ul> 
    <li *ngFor="let node of nodes"> 
     {{ node.name }} 
    </li> 
</ul> 

该应用程序运行正常，没有错误。

我做了什么错，我应该做什么不同？如果解决方案是向ComponentA添加一个导入，我会接受这个答案，因为提供了一个很好的解释（例如为什么* ngFor有效，但是树根指令没有）。

Answer 1

我又回到了起点，实现什么我错过：

在feature-b.module.ts我应该有导出组件：

exports: [ 
    FeatureBComponent 
] 

我也有必要导入FeatureBModule而不是FeatureBComponent。

从'../feature-b/feature-b'导入{FeatureBComponent}。零件';

import { FeatureBModule } from '../feature-b/feature-b.module'; 

Answer 2

我能够通过完全删除FeatureBModule来运行应用程序。那么FeatureAModule是正确的，因为它需要delcare FeatureBComponent。

然后FeatureAModule看起来是这样的：

import { NgModule }  from '@angular/core'; 
import { CommonModule } from '@angular/common'; 

import { FeatureAComponent }   from './feature-a.component'; 
import { FeatureARoutingModule }  from './feature-a-routing.module'; 
import { TreeModule }     from 'angular-tree-component'; 

import { FeatureBComponent } from '../feature-b/feature-b.component'; 

@NgModule({ 
    imports: [ 
    CommonModule, 
    FeatureARoutingModule, 
    TreeModule 
    ], 
    declarations: [ 
    FeatureAComponent, 
    FeatureBComponent 
    ] 
}) 
export class FeatureAModule {} 

我更新这里的plunker：https://plnkr.co/edit/mkGH5uG1FGsWWpWbS1Zw?p=preview