Question

我有这个：

import {StepOnePage} from '../../pages/step-one/step-one';
import {StepTwoPage} from '../../pages/step-two/step-two';
import {StepThreePage} from '../../pages/step-two/step-one';
import {StepFourPage} from '../../pages/step-two/step-one';
import {StepFivePage} from '../../pages/step-two/step-one';

如何在这些import语句中添加条件？

我尝试在构造函数中导入，因此我可以应用条件：

If currentStep is 'Step1' 
    then import StepTwoPage

然而，它给了我这个错误：

EXCEPTION: Error: Uncaught (in promise): Unexpected directive value 'undefined' on the View of component 'StepOnePage'

或者我可以将所有内容导入为另一种解决方案，但是，我担心在页面中有超过必要的导入的性能问题。

请指教。谢谢。

Answer 1

进口只会在开发过程中产生性能影响。构建可部署的数据后，将解析导入，并将所有内容打包到单个文件中（除非您指定延迟加载部分），并且不会对性能产生任何影响。

Answer 2

我认为你不能有条件import。 import操作是顶级操作，因为它们必须在代码运行之前进行解析和解析。请记住，import的全部目的是为编译器提供解释和执行其余代码的工具。

至于性能，import将增加网络请求的数量和使用的带宽量，因此它会对性能产生影响。 import当前文件实际需要的内容。

Angular2 - 如何条件导入，更多导入会降低性能？

2 个答案: