Angular （如何）可以将角度组件拆分为多个单独的部分？

免责声明此问题不考虑创建组件及其子组件的模式（如前所述）。它不考虑组件及其类型的选择（如所讨论的）。这并不意味着以观点为基础，如果我的语言能力在表达时失败，我会提前道歉

我们有一个具有相当多逻辑的组件（特定于某个组件，而不是其他组件）。该逻辑根据其他输入更新许多条目。更新由一组复杂的不规则业务规则管理。随着时间的推移，组件变得越来越大，需要进行大量的滚动。这表明是时候重构它了

在C#中，我可以使用partial并创建一个文件，将类的其余部分保存在当前开发的视线之外。就我所知，但目前，也不打算

我可以为这个特定组件创建一组单独的实用程序类。不过，这看起来像是一次黑客攻击。我是这么想的

<plopp (click)="onClick($event)">...

...
onClick(event: KeyboardEvent) { Aux.onClick(event, this.something, ...); }

。。。
...
onClick（event:KeyboardEvent）{Aux.onClick（event，this.something，…）；}

此外，即使我创建了一个单独的类来处理所有事件（在我们的例子中这将非常有意义），我仍然需要一个模板文件可以绑定到的方法（然后将调用传递给辅助文件），并且还需要将大多数属性发送给辅助文件

---

在这种情况下，什么是按部就班的方法？如链接所示，我已经深入研究了这一点，但我得出的结论很少。诚然，这不是最常见的情况，但这是一种情况，我更愿意相信它可以以适当的方式解决。

假设，您使用的是Visual Studio代码，您的问题只是让大量代码更加清晰，您可以使用一个特色标记来创建区域，就像您从C#中了解到的那样

它的使用方式如下：

export class ExampleComponent {

    // #region I want this to be foldable
    ...
    A lot of code
    ...
    // #endregion

}

---

如果您想使用Visual Studio代码获得有关区域功能的更多信息，请查看此处：

您的问题是否只是关于保持概述并更快地在组件中查找特定部分？如果是这样，您还可以使用

/#region

和

/#endregion

标记对组件中的区域（事件处理程序、函数…）进行分类，这些区域可以折叠和展开（假设您使用的是Visual Studio代码）@schlonzo我不知道TypeScript中有区域功能。我在后端代码中使用了区域化，并发现它非常有用。然而，在TS中，我没有看到这一点。这是VS代码特有的特性吗？我没有将TS代码传输到JS，我的Lint对此表示不满。我错过了什么吗？是的，我认为这是Visual Studio独有的代码功能。我很困惑，它会导致您的代码无法传输，而您的Linter会抱怨。它只是一个注释，由VS代码进行特殊处理。也许门楣不喜欢//和#之间没有空格。有关TypeScript和VS中区域的更多信息，请参阅Code@schlonzo我真傻。我一定是想到了C风格，没有注意到你评论中的双斜杠。我只是简单地尝试了

#region

，就像我在C#中习惯的那样，但是，正如我所提到的，它不起作用。一旦我听从了你的实际建议，我就成功了（尽管缺少空间，林特也没有抱怨，这有点奇怪，但目前我对自己在这个问题上的无知感到满意）@schlonzo您可能想把您的评论和一个简短的示例作为答案，这样我就可以接受。这不会需要1000多行代码，然后神奇地将其转换为200行代码。这不是重构。这些代码应该被分割成不同的文件。