问题标签 [angular-cli-v6]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
5452 浏览

angular - 构造函数初始化后未定义Angular 6服务

我有一个服务(ClientProfileService)通过构造函数注入到我的组件中,如下所示:

如Angular Material 文档中所述,我使用 [displayWith] 属性在模板中使用 Angular Material Autocomplete 组件。每当我在下拉框中选择一个值时,所选值 (clientId) 都会传递给“autoCompleteDisplay”函数。该部分工作正常,并且当我想要它时会调用“autoCompleteDisplay”。

ClientProfileService 的定义如下:

我已经在多个组件中引用了服务中的 BehaviorSubject,甚至在其他返回 observables 时没有问题的函数中,我在这种情况下省略了这些,以使帖子更具可读性。

当调用“autoCompleteDisplay”函数时,我收到一个错误:

所以 ClientProfileService 在这个特定点在组件中是未定义的,但是为什么呢?我已经使用完全相同的方法在应用程序的其他几个区域初始化了此服务,没有任何问题。

0 投票
1 回答
4263 浏览

angular - 带有 Angular 6 库的 SCSS

有什么方法可以将 SCSS 与 Angular 6 库功能一起使用?

如果我运行这个命令

我收到一个错误

Schematic 输入不针对 Schema 进行验证:{"style":"scss","entryFile":"public_api","prefix":"lib","skipPackageJson":false,"skipTsConfig":false} 错误:

数据路径“”不应具有其他属性(样式)。

0 投票
2 回答
1376 浏览

node.js - 如何从其他机器访问 Angular 6 应用程序?

我安装了 Angular 6,它在我的本地机器上运行。但不要运行另一台连接本地网络的机器。我已经尝试了这些步骤,但没有使用。

上面的命令在我的机器上运行良好,但在连接本地网络的同事机器上却不行。我正在使用ubuntu 16.04,并在 ubuntu 和 windows 机器上进行了测试。版本:

但我可以在其他机器上使用http://10.0.136.126/phpmyadmin访问我的 phpmyadmin 或任何 php 项目。

0 投票
4 回答
9692 浏览

angular - ng-cli 6 和字体真棒图标不起作用

我正在使用 font-awesome 4.70、angular 6.0.8 和 cli 6.0.8(下面的完整版本)我正在尝试用 cli 的“ng build”替换我们现有的 webpack 进程。我遇到了字体真棒图标没有显示的问题。我过去曾在旧版本中看到过类似的问题,但我还没有找到解决方案。

我的资产中连接了字体

我在我的 angula.json 的样式部分中包含了 css

我没有使用“ng serve”,我只是使用 build 命令来转译我的代码。在浏览器中,我收到这些错误。

GET http://localhost:29380/fontawesome-webfont.woff2?v=4.7.0 404(未找到)

GET http://localhost:29380/fontawesome-webfont.woff?v=4.7.0 404(未找到)

GET http://localhost:29380/fontawesome-webfont.ttf?v=4.7.0 404(未找到)

我在输出目录中看到了资产,但由于某种原因它们不可用,我得到了 404。

在此处输入图像描述

0 投票
2 回答
1436 浏览

angular - angular 6 build chunks 名称很奇怪而且大小很大

我正在使用 angular 6 并预加载所有组件,我有 8 个组件:ScreensComponent, AccountComponent, DashboardComponent, FinderComponent, ListerComponent, MonitorComponent, AuthComponent,LoginComponent

但输出是 11 个文件(不包括 main.js 和其他文件)。

我无法理解为什么有 11 个块并且它们的名称很奇怪。此外,大多数文件都非常庞大,我似乎无法理解为什么所有文件都那么重

0 投票
3 回答
13690 浏览

angular - Angular-CLI v6:--no-aot 构建选项等效

我最近从 Angular v5.2.4 与 Angular-CLI v1.7.4 合作升级到 Angular v6.0.3 与 Angular-CLI v6.0.8 合作。

由于使用了动态组件,我的项目需要 JIT 编译器。因此,我的构建脚本曾经是:ng build --prod --no-aot.

我需要继续使用该--prod标志来保留摇树、代码缩小和死代码消除的好处。但是,默认情况下--prod启用 AOT。该--no-aot选项曾经是禁用 AOT 的解决方案,但仍然可以获得--prod构建的好处。

我尝试了以下选项,您可以看到没有成功构建(标准--prod构建除外)。我也没有从 CLI 获得任何信息,这也不是很有帮助:

在此处输入图像描述

我已经阅读了Official Angular Deployment Docs以及Official Angular-CLI build Wiki并没有找到任何信息来帮助解决这个问题。

有谁知道选项的替代品是什么,或者在禁用 AOT 的同时--no-aot进行构建的新方法?--prod

0 投票
2 回答
2344 浏览

angular - Bootstrap 不适用于我的 Angular 项目

我已使用以下步骤将引导程序包含到我的 Angular 项目中

  1. 使用 cli 创建 angular 项目
  2. npm install bootstrap@3 jquery --save
  3. 然后像往常一样将脚本和样式路径添加到我的索引文件中

该样式不适用于我的页面。还有什么我必须做的。我正在从索引页面添加我的 HTML 代码片段

版本详细信息是:Angular CLI:6.0.8

节点:8.11.2

操作系统:win32 x64

角度:6.0.5

... 动画、通用、编译器、编译器-cli、核心、表单

... http、语言服务、平台浏览器

...平台-浏览器-动态,路由器

包版本

@angular-devkit/架构师 0.6.8

@angular-devkit/build-angular 0.6.8

@angular-devkit/build-optimizer 0.6.8

@angular-devkit/核心 0.6.8

@angular-devkit/schematics 0.6.8

@角/cli 6.0.8

@ngtools/webpack 6.0.8

@原理图/角度 0.6.8

@原理图/更新 0.6.8

rxjs 6.2.1

打字稿2.7.2

网络包 4.8.3

谢谢

0 投票
2 回答
1190 浏览

angular - Angular-6 如何在浏览器上运行构建文件并在 angular2-cli 应用程序文件发生更改时自动检测更改?

我正在运行 angular2-cli 应用程序并尝试在浏览器上运行构建文件以进行查看,当文件更改时,这些构建文件应该自动检测更改并更新更改并像观察者一样自动在浏览器上查看?

如何做到这一点?

我使用了以下命令:-

创建构建文件后,如何使用这些构建文件显示视图并在应用程序中的文件发生更改时自动检测更改并且相应的视图应该更新?

我正在使用部署 dist 文件

http-server ./dist.

但是,angular-app 中的任何更改都不会更新。

文件更改和保存时出错:-

0 投票
2 回答
10226 浏览

angular - Angular 模块与库

太好了,Angular 已经发布了第 6 版,并且 CLI 提供了一个生成库的选项——他们称之为“备受期待的功能”。

现在,从商业角度来看,我想知道:

  • 为什么你真的需要这个,
  • 为什么在现有项目内部而不是单独的项目中,您可以像往常一样通过 npm 安装...
  • 如果你想在你的项目中使用它,为什么不使用一个模块呢。

所以我明白了,在 npmjs 上发布一些东西,并希望整个世界和未来的互联事物都需要它。图书馆,不错。

在更大公司的大型系统中,我们可以重用库,但我们已经能够通过模块重用东西。每次更改某些内容时,我都需要单独构建库并重新编译..

使用库而不是模块的原因是什么?

(目前我会说一个库可以比一个模块更大,所以我会它来更好地组织我的应用程序)

0 投票
6 回答
10980 浏览

angular - AngularCLI 和 Angular 材质(原理图)错误:无法解析集合“@angular/material”

我正在尝试使用此页面上显示的 Angular 架构。 当我尝试在项目根目录的终端中使用以下命令ng generate @angular/material:material-nav --name name-of-new-nav时,出现以下红色错误,

无法解析集合“@angular/material”。错误:无法解析集合“@angular/material”。在 NodeModulesEngineHost._resolveCollectionPath (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/tools/node-module-engine-host.js:88:15) 在 NodeModulesEngineHost。 createCollectionDescription (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/tools/file-system-engine-host-base.js:106:27) 在 SchematicEngine._createCollectionDescription (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/src/engine/engine.js:78:40)在 SchematicEngine。在 Object.getCollection (/Users/jeremypeters/ MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/utilities/schematics.js:28:31) 在 GenerateCommand.getOptions (/Users/jeremypeters/MEGA/development/learning/angular/material-learn /node_modules/@angular/cli/models/schematic-command.js:193:41) 在 GenerateCommand。(/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) 在 Generator.next () 在 /Users/jeremypeters/MEGA/development /learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise () 在 GenerateCommand.getOptions (/Users/jeremypeters/MEGA/development/学习/角度/材料学习/node_modules/@angular/cli/models/schematic-command.js:193:41)在 GenerateCommand。(/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) 在 Generator.next () 在 /Users/jeremypeters/MEGA/development /learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise () 在 GenerateCommand.getOptions (/Users/jeremypeters/MEGA/development/学习/角度/材料学习/node_modules/@angular/cli/models/schematic-command.js:193:41)在 GenerateCommand。(/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) 在 Generator.next () 在 /Users/jeremypeters/MEGA/development /learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise () 41) 在生成命令处。(/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) 在 Generator.next () 在 /Users/jeremypeters/MEGA/development /learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise () 41) 在生成命令处。(/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) 在 Generator.next () 在 /Users/jeremypeters/MEGA/development /learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise ()

我怎样才能让它工作?

信息:Angular CLI:6.0.8