Javascript ng.core.Component(…).Class不是函数

Javascript ng.core.Component(…).Class不是函数,javascript,angular,ecmascript-5,angular5,Javascript,Angular,Ecmascript 5,Angular5,我使用的是Angular 2的ES5风格。因此,我没有使用装饰器,而是定义了一个模板,如下所示: var someComponent = ng.core.Component({ // component configuration }).Class({ // component class }); 它工作得很好。最近我升级到Angular 5,现在对于相同的代码,我有以下错误: 类不是一个函数 ng.core.Component….Class>不是一个函数 指令…类不是函数 在

我使用的是Angular 2的ES5风格。因此,我没有使用装饰器,而是定义了一个模板,如下所示:

var someComponent = ng.core.Component({
    // component configuration
}).Class({
    // component class
});
它工作得很好。最近我升级到Angular 5,现在对于相同的代码,我有以下错误:

类不是一个函数 ng.core.Component….Class>不是一个函数 指令…类不是函数


在Angular 5中,我应该如何改变这一点?

JavaScript目前被认为是二等无双关公民,而TypeScript是首选语言,主要是因为它关注AOT编译,而AOT编译仅适用于TypeScript

如前所述

不再能够以这种格式声明类

Component({...}).
Class({
  constructor: function() {...}
})
此格式仅适用于JIT和ES5。这种模式不适用 允许像Webpack这样的构建工具来处理和优化代码 结果会产生令人望而却步的大束。我们正在删除此API 因为我们正在努力确保每个人都能在 默认设置,并且不可能使用ES5进入快速路径 DSL。替换方法是使用TypeScript和@Decorator格式

如中所述,在普通ES5及更高版本中,decorator的替代方法是对类进行注释,从而对具有注释和参数静态属性的函数进行注释

所以

变成

SomeComponent.annotations = [new ng.core.Component(...)];
SomeComponent.parameters = [
  [new ng.core.Inject(Svc)]
];
function SomeComponent(svc) {...}
SomeComponent.prototype.foo = function () {...};
作为类功能的替代,任何第三方实用程序类库都可以用于在ES5中引入语法糖和继承,以替代函数,例如或


最好将现有的Angular JavaScript应用程序迁移到TypeScript,后者在AOT编译模式下提供了卓越的性能和更小的应用程序占用空间,这将是未来版本的默认模式。

JavaScript目前被认为是二等无双关公民,而TypeScript是首选语言,主要是因为它关注AOT编译,而AOT编译仅适用于TypeScript

如前所述

不再能够以这种格式声明类

Component({...}).
Class({
  constructor: function() {...}
})
此格式仅适用于JIT和ES5。这种模式不适用 允许像Webpack这样的构建工具来处理和优化代码 结果会产生令人望而却步的大束。我们正在删除此API 因为我们正在努力确保每个人都能在 默认设置,并且不可能使用ES5进入快速路径 DSL。替换方法是使用TypeScript和@Decorator格式

如中所述,在普通ES5及更高版本中,decorator的替代方法是对类进行注释,从而对具有注释和参数静态属性的函数进行注释

所以

变成

SomeComponent.annotations = [new ng.core.Component(...)];
SomeComponent.parameters = [
  [new ng.core.Inject(Svc)]
];
function SomeComponent(svc) {...}
SomeComponent.prototype.foo = function () {...};
作为类功能的替代,任何第三方实用程序类库都可以用于在ES5中引入语法糖和继承,以替代函数,例如或


将现有的Angular JavaScript应用程序迁移到TypeScript是非常明智的,后者在AOT编译模式下提供了卓越的性能和更小的应用程序占用空间,这将是未来版本的默认模式。

完全不相关,但请告诉我为什么选择使用ES5而不是tyescript?@Dhyey,为什么不相关?我们必须使用ES5的原因是因为我们在一个公司架构中使用Angular,它强制执行Angular中不支持的更多内容。例如,没有办法在多个Angular项目中使用一个json配置。完全不相关,但是你能告诉我为什么你选择使用ES5而不是tyescript吗?@Dhyey,为什么不相关?我们必须使用ES5的原因是因为我们在一个公司架构中使用Angular,它强制执行Angular中不支持的更多内容。例如,没有办法在许多Angular项目中使用一个json配置。我个人的经验是,Angular 2对于那些在进入它的世界之前就有一些基础设施的人来说是令人沮丧的,对于现实世界的公司需求来说,它根本不成熟。我已经解释过了。根据你的另一个答案,我想你可能也同意这一点。@SaeedNeamati我不喜欢团队做出的一些决定,但你列出的大部分要点可能是由于缺乏角度发展的经验,除了角度是自以为是的,不适合所有人。许多基础设施问题都应该通过Angular CLI和/或样板回购来解决。开发人员所需要做的就是启动并进行更改,以保持项目同步,没有“容易偏离”的问题。我们不想为每个组件创建一个模块来惰性地加载模块——极端模块化是自A1以来的“最佳实践”。TS和进口产品应该解决很多问题和人为错误。您可以在同一个项目中保留多个框架版本。你不能在A1中这样做。除了AOT不能工作这一事实之外
使用原始ES5/ES6。AOT是有缺陷的,但它允许框架的性能和足迹与反应和VUE或多或少保持一致,这是A2发布后的一个问题,否则就不可能了。请注意,React和Vue都是编译的。@estus,函数SomeComponent{…}不能用作.Class{…}的替换,因为该类以JSON对象作为参数,当然还有构造函数,但函数定义以JavaScript作为主体。你能给我一个真实的例子吗?@mohammadrostamisiahgeli.Class的结果。。。是一个函数。类{构造函数:函数{/*init*/},foo:…成为函数SomeComponent{/*init*/};SomeComponent.prototype.foo=…;这不是Angular开发特有的。这是关于如何在ES5中完成“类”的问题。您是否查看了链接答案中的ES5和ES6示例?我相信它详细地描述了这一点。我个人的经验是,Angular 2对于那些在进入应用程序之前拥有一些基础设施的人来说,不知何故令人沮丧对于现实世界中的企业需求来说,它根本不成熟。我已经解释过了。根据你的另一个回答,我想你可能也同意这一点。@SaeedNeamati我不喜欢团队做出的一些决定,但你列出的大多数要点可能是由于缺乏角度开发的经验,除了角度很多基础设施问题都应该通过Angular CLI和/或样板报告来解决。开发人员所需要做的就是启动并进行更改以保持项目同步,而不是“容易偏离”的问题。我们不希望为每个组件创建一个模块来延迟加载模块-极端模块化AIS是最好的实践,因为A.TS和导入应该解决很多问题和人的错误。你可以在同一个项目中保留几个框架版本。A1不能这样做。AOT不能与原始ES5/ES6一起工作。AOT是有缺陷的,但是它允许框架的性能和足迹与RE保持一致。act和Vue或多或少-自A2发行版以来一直存在问题,否则不可能实现。请注意,React和Vue都是编译的。@estus,函数SomeComponent{…}不能用作.Class{…}的替换项,因为类得到一个JSON对象作为参数,当然还有构造函数,但是函数定义得到JavaScript作为主体。你能给我一个关于这个的真实例子吗?@mohammadrostamisiahgeli.Class…的结果是一个函数..Class{constructor:function{/*init*/},foo:…变成function SomeComponent{/*init*/};SomeComponent.prototype.foo=…;这不是特定于角度开发的。这是关于如何在ES5中完成“类”。您是否检查了链接答案中的ES5和ES6示例?我相信它详细描述了这一点。