【问题标题】:Angular directive inputs over component from another module cause an error来自另一个模块的组件上的 Angular 指令输入会导致错误
【发布时间】:2019-11-03 07:36:48
【问题描述】:

有以下用例:
-1- 我在模块 1 中有一个指令(用于拖动的指令)
-2- 该指令有几个来自组件的输入 (@Input()) 属性


该指令与模块 1 中的组件完美配合。 问题在于指令何时应用于模块 2 中的组件。
我完全了解有关模块的导入导出机制: 模块 2 中的组件被声明并导出。
模块 1 导入模块 2。组件在模块 1 中可用。它被正确渲染。应用指令后 - 一切都恢复正常。但是由于该指令在应用时具有多个 @Input() 属性,因此会发生以下错误:(请原谅我的小字体!)

这是组件模板:

正如我所提到的 - 问题在于何时应用指令的属性! 您能解释一下在这种情况下出了什么问题吗 - 组件导出为 在文档中描述。模块 2 是从模块 1 导入的,但这还不够。

【问题讨论】:

  • 它是否也抱怨绑定“appDraggable”?你能发布你的指令代码吗?
  • 模块 2 是否导入 1?
  • @itdoesntwork - 不,导入方向相反 - 模块 1 导入模块 2
  • @Freddy - 这是指令的代码jsfiddle.net/virto/kf6azn4e/1。我没有应用一个工作示例,因为这个问题可能很简单。而且正如我上面提到的 - 当指令在不属于输入属性的情况下应用时没有任何抱怨。
  • 既然指令在模块 1 中并且在模块 2 中存在的组件中使用,那么 2 不应该导入 1 吗?

标签: angular angular2-directives angular-directive angular-components angular-module


【解决方案1】:

如果我理解正确,您的模块之间的关系是这样的。

  1. 模块 1 有指令

  2. 模块 2 具有组件

  3. 模块 1 导入模块 2

  4. 您从模块 2 导出组件

完成这项工作的方法是将模块 1 导入模块 2。

如果你想把事情分开,一个可行的例子就是这样。

从组件模块导出的组件将能够使用来自导入模块的服务和指令。

我对设计决策的建议是让所有东西都可以插入。问自己两个问题,,,将这些模块复制到新项目需要多少努力?依赖关系是什么?..

【讨论】:

  • @tdoesntwork - 谢谢!我必须测试它。但是这种行为的逻辑在哪里,因为角度模块充当“盒子”并导出组件以供其他组件使用。在我们的项目中,我们将服务、管道和指令分开。为此,我们还使用了共享模块,但该指令被放置在另一个模块中。如果是真的,可能目的是将所有指令放在共享模块中,然后从那里导入“消费者”模块。无论如何,对我来说这是一种奇怪的行为!
猜你喜欢
  • 2017-06-04
  • 2019-02-21
  • 2020-01-17
  • 2019-05-27
  • 1970-01-01
  • 1970-01-01
  • 2017-02-17
  • 2020-07-24
  • 2021-01-03
相关资源
最近更新 更多