小编Riy*_*Riy的帖子

Angular 2 VS Aurelia?2017年

我一直在评估许多SPA框架.我坚持以下两个,无法决定我应该使用哪一个项目:

  1. Angular 2
  2. 奥里利亚

这两个框架都承诺进行大量的操作.我非常为角度2感到兴奋,因为它得到了Google的支持,并且已被许多大公司采用.所以我做了一些比较我自己(手指交叉)的借口给Angular粉丝;).我也是粉丝,但.....

这是我做的:

Angular 2

  1. https://github.com/angular/quickstart/archive/master.zip下载QuickStart
  2. 按照快速启动和运行应用程序的指示,到目前为止一切顺利
  3. 现在来看看chrome Developer工具中的Network选项卡.哇,我看到至少36个http请求和这个简单应用程序的总大小约为1.4MB缩小.
  4. 谷歌搜索了一下,发现我们可以通过遵循AOT,treeshaking,gzip等很多其他方法来减小大小并最小化直到50k和http请求到10.很公平.
  5. 最后比较编码风格:为了只显示Hello Angular,我们需要创建main.ts,app.module.ts,app.component.ts.每个文件必须包含@Component()装饰器,因此几乎需要在每个模块上导入角度核心.然后将该组件导入module.ts,然后引导main.ts.

奥里利亚

  1. http://aurelia.io/downloads/basic-aurelia-project.zip下载
  2. 按照快速启动的说明进行操作.
  3. 添加了两个带有hello world的app.ts和main.ts文件.
  4. 到目前为止运行它运行的应用程序非常好.
  5. 检查开发人员工具中的网络选项卡,它显示0.9MB并发出9个http请求.
  6. 按照相同的步骤使用gzip和捆绑最小化大小后,它会产生大约170kb的5个http请求.

最后比较了两种框架的编码风格.显然,Aurelia有一个易于理解的清晰代码.

我在Aurelia看到的唯一的缺点是它是一个相当新的,几乎不为许多JS开发人员所知,并且到目前为止社区也很差.

我将它们视为Microsoft Windows(Angular 2)和Apple(Aurelia).另一方面,Apple更稳定并且具有特定范围的用户Microsoft Windows几乎每个地方都有.

我该怎么办?请帮忙.

谢谢

single-page-application aurelia angular

16
推荐指数
1
解决办法
1万
查看次数

具有延迟加载的 angular 4 多个全局样式

到目前为止,我正在使用angular-cli 1.3.2 版构建一个 angular 4 应用程序。我在文档中读到我们可以在https://github.com/angular/angular-cli/wiki/stories-global-styles使用全局样式和延迟加载。

现在当我运行命令时

ng build --prod -vc -nc --build-optimizer
Run Code Online (Sandbox Code Playgroud)

它为引导程序生成以下输出

块 {bootstrapBundle} bootstrapBundle.cf320d25069acd157990.bundle.css (bootstrapBundle) 96.9 kB {inline} [initial]

根据我的理解,这个 css 应该应用于网站,但是,当我看到该网站时,它没有应用任何引导 css。

现在,如何在站点中使用 bootstrapBundle 或 bootstrap 块?

这是我的angular-cli.json样式配置

"styles": [
      "styles.scss"
       {
         "input": "./assets/smartadmin/bootstrap.scss",
         "lazy": true,
         "output":"bootstrapBundle"
       },
    ],
Run Code Online (Sandbox Code Playgroud)

请帮忙。

谢谢。

angular-cli angular

6
推荐指数
1
解决办法
5185
查看次数

延迟加载的模块中的Angular 4.4.6共享服务

我现在搜索了大约2个星期,但找不到任何适合我问题的答案。所以我在这里问。

描述

工具:Angular 4.4.6和Angular-CLI 1.4.9

我正在开发一个非常简单的应用程序。它具有AuthModule,AdminModule,LayoutModule和SharedModule。如果我将所有这些模块都添加到AppModule中,一切都将正常工作,但是问题是,当我将这些模块也添加到AppModule中时,再加上我的供应商...。大小超过600kb(--aot)。

模块说明。

ShareModule:具有每个模块都通用的一些模型和服务,例如HttpServiceAuthModule:包含使用共享模块中的HttpService的简单Login和Register组件

所以我决定把他们都作为被描述路由懒加载的模块在这里。这将供应商... js的大小减少了近50%,但随后依赖项不起作用。

尽管我在LazyLoaded模块中引用了SharedModule,但仍然不能解决问题,但是依赖项不起作用。我知道,每个延迟加载的模块都会创建自己的DI树,但是除了在延迟加载的模块内部已创建和提供的依赖关系之外,它不会解析其他依赖项。

就像我在工具部分所说的那样,我使用的是Angular-CLI,它具有检测某些组件中使用过两次的相似模块的强大功能,如果这样,它将为该模块创建common ... js。但是仍然存在问题,我无法在延迟加载的模块中访问共享服务。

有没有可能或者有人可以指出如何在延迟加载的模块中加载共享服务?

谢谢

lazy-loading angular

2
推荐指数
1
解决办法
2096
查看次数

Angular中的事件数组

我正在为我的项目使用角度5.我试图从子组件中发出事件

@Output studentUpdated:EventEmitter<any> = new EventEmitter()
updated(e){
   this.studentUpdated.emit(e);
}
Run Code Online (Sandbox Code Playgroud)

并在父组件中列出

<student (studentUpdated)="showSuccess($event)" />
Run Code Online (Sandbox Code Playgroud)

哪个工作如预期.但是在我的学生组件中,我需要实现几个事件.例如保存,更新,删除,确认,预定......等

我在思考而不是每行编写一个事件并单独调用它们,是否有可能我们可以初始化事件数组并根据需要执行它们.例如

  @Output() events:EventEmitter<any>[] = []
  for(var keyNum in arrayOfEvents)
  {
        var key = arrayOfEvents[keyNum];
        this.events.push(new EventEmitter())
  }
Run Code Online (Sandbox Code Playgroud)

然后在某些事件中,我们根据索引发出事件.

this.events[0].emit(e)
Run Code Online (Sandbox Code Playgroud)

如果我们可以,那么我们如何做到这一点,以及我们如何在父组件上监听该事件?

angular angular5

2
推荐指数
1
解决办法
151
查看次数