问题标签 [angular7]

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 投票
2 回答
1459 浏览

angular - 无法绑定到“formGroup”,因为它不是 Angular 7 中“form”的已知属性

我正在使用 Angular 7 的 web api 进行登录,但是当我使用时,<form [formGroup]="loginForm" (submit)="loginFormSubmit()">我得到了错误,这段代码有什么问题。

在此处输入图像描述

login.component.html

登录组件.ts

我该如何解决?

谢谢!

0 投票
1 回答
635 浏览

angular6 - NgRx 存储列表和详细数据对象

我对 NgRx 很陌生,我正在努力解决它。我了解目标是拥有一个存储不同类型状态的数据存储。我试图了解如何使用数据列表。

场景 1:用户首先导航到一个列表,在这种情况下会触发效果以从后端/API 检索列表。成功后,列表被保存到 store,UI 组件响应 observable via| async并渲染列表。用户单击项目以查看详细信息。我们可以将所选项目的 Id 存储在存储中,然后简单地使用过滤机制从存储中的列表数组中检索详细数据。或者,我们可以对服务器进行另一个效果调用以获取详细的有效负载。我假设这里的决策点是列表是否包含详细信息页面所需的所有数据?

场景 2:假设商店中的列表包含详细信息页面所需的所有数据,并且用户单击列表中的项目只需将所选项目的 id 保存到商店,然后导航到详细信息页面,其中详细数据被简单地过滤从基于商店中所选商品 id 的列表中,当用户在详情页面上刷新浏览器 URL 时会发生什么?发生这种情况时,列表不再存在于商店中,所选项目的 id 也不再存在。但是,所选项目的 id 在 URL 和路由中。您如何处理这种情况?您是否重建列表以检索详细记录?

场景 3:处理整个列表中有不同数据子集的场景的最佳方法是什么。也许您需要查看“待处理”项目的列表和本周已创建的另一个项目列表等。将所有记录作为主列表下载到商店然后简单地过滤掉所需的记录似乎非常低效为不同的观点。我已经阅读了教程,其中您在商店中拥有主列表,然后只需在商店的另一部分中拥有组成不同切片的 ID。这似乎很重,并且将数据库复制到客户端上。在商店中过滤列表的最佳方法是什么?

感谢您的帮助和洞察力。

0 投票
7 回答
28495 浏览

font-awesome-5 - 在角材料 7 上使用 font awesome 5

我正在使用 angular 7.0.1 和 angular material 7.0.2,我想添加字体真棒 5.4.2 图标,我正在尝试按照 fontawesome web 上的步骤操作,但我无法获得字体真棒图标字体。

第一的:

然后在styles.scss 中添加:

并在 _variables.scss 添加:

现在在 app.component.ts 添加:

最后我应该用以下方法打印字体真棒图标:

但是字体真棒图标字体永远不会被打印出来。我错过了一些重要而明显的东西,但现在我没有看到它。

0 投票
1 回答
2755 浏览

angular - 无法从 Angular 7 中的材质主题中获取变量

我有 Angular 7.0.3,我正在尝试使用我的材质主题的原色创建 scss 变量

但收到此错误

我该如何解决这个问题,或者我需要向您提供哪些关于我的设置的额外信息?

0 投票
3 回答
1204 浏览

angular - Angular 7 with .net core 2.1 - 为特定页面启动

我有一个 .NET Core 2.1 网站,Angular 7 位于 /ClientApp 中。

我正在使用 Microsoft.AspNetCore.SpaServices.Extensions

如果我转到一个页面,例如 localhost:5001/pagedoesnotexist/index,那么由于某种原因,Angular 应用程序会启动。

问题 - 如果我转到不存在的页面,如何更改配置以使 ASP.NET Core 不会尝试重定向到 Angular 应用程序?
我希望它在不正确的网络请求时简单地返回标准 404。我想要一个特定的页面,例如 /admin/dashboard 只为 Angular 应用程序提供服务

启动.cs

公共无效配置(IApplicationBuilder 应用程序,IHostingEnvironment env)

虽然这是我的第一个 Angular 应用程序,但到目前为止它似乎运行良好,问题出在开发环境中。

谢谢。

更新 1

进一步澄清一点:

通过:我想要 localhost:5001/ = 404

PASS:我希望 localhost:5001/angtastic/ 为应用程序提供服务

失败:我从 zone.js (socksjs-node/info) 得到重复的 info?t=[random numbers] (它可以在没有下面针对子文件夹的代码的情况下工作,所以也许我做错了什么)。我的猜测是套接字或与 webpack 相关的东西(在 angular cli 的引擎盖下)在处理此子文件夹中的应用程序时遇到了麻烦。

我有一个带有问题的部分解决方案:

此外,将 index.html 更改为 BaseURL 为 .

这是我的 Angular.json

0 投票
0 回答
174 浏览

rxjs - 当 angular 6 上的可观察订阅发生变化时如何更新视图?

我有一个在可观察对象上发布对象的服务,但是当我使用订阅更新数组时,新对象不会显示在列表(html)上:

在可观察的 $collection 上发布的新对象应该显示在 CardList 上,但是尽管 console.log(data_card) 显示了新对象,但没有刷新任何内容。

存储库代码:HomeComponentCardListComponent

0 投票
1 回答
5102 浏览

javascript - 未捕获的 SyntaxError:意外的令牌导出 - popper.js 错误

Angular 给出了错误: bootstrap 4 中的 popper.js 给出了 SyntaxError Unexpected token export

我从浏览器控制台收到此错误。

即使我更改了 popper.min.js 位置参考但没有用..

node_modules/popper.js/dist/umd/popper.min.js

node_modules/popper.js/dist/ems/popper.min.js

Angular.json

0 投票
1 回答
1301 浏览

javascript - Angular 7:ngsw-worker.js 加载失败

问题

有一个使用Service Worker的通用应用程序。

最近从Angular 6.1升级到7

将更新后的文件上传到服务器后:

在此处输入图像描述

细节:

The script has an unsupported MIME type ('text/html'). Failed to load resource: net::ERR_INSECURE_RESPONSE main.2733b77522d2feee4713.js:1 ERROR Error: Uncaught (in promise): SecurityError: Failed to register a ServiceWorker: The script has an unsupported MIME type ('text/html'). at j (polyfills.92108b287fe28032870b.js:1) at polyfills.92108b287fe28032870b.js:1 at polyfills.92108b287fe28032870b.js:1 at e.invoke (polyfills.92108b287fe28032870b.js:1) at Object.onInvoke (main.2733b77522d2feee4713.js:1) at e.invoke (polyfills.92108b287fe28032870b.js:1) at t.run (polyfills.92108b287fe28032870b.js:1) at polyfills.92108b287fe28032870b.js:1 at e.invokeTask (polyfills.92108b287fe28032870b.js:1) at Object.onInvokeTask (main.2733b77522d2feee4713.js:1) Sr @ main.2733b77522d2feee4713.js:1 t.handleError @ main.2733b77522d2feee4713.js:1 ... (anonymous) @ main.2733b77522d2feee4713.js:1 The script has an unsupported MIME type ('text/html'). Failed to load resource: net::ERR_INSECURE_RESPONSE The script has an unsupported MIME type ('text/html'). Failed to load resource: net::ERR_INSECURE_RESPONSE

SSL

使用由https://letsencrypt.org/生成的有效证书。

Chrome 安全性

在此处输入图像描述

0 投票
1 回答
8547 浏览

angular - 角度错误:[object Object] resolvePromise

我正在使用 Angular 7 并使用 observable 调用简单的服务

虽然编译代码没问题,但是当它点击注册网址和组件时,它会给出错误

如果我从组件中删除此服务类,//import {AuthService} from '../../services/auth.service';则代码运行时不会出错。尝试返回简单return user但仍然出现错误。也尝试在没有观察到的情况下返回。你能帮我在哪里做错吗

0 投票
3 回答
1184 浏览

angular - JSONP 调用成功,但出现错误:JSONP 注入脚本未调用回调

我正在尝试对以下 API 进行 JSONP 调用:https ://api.openrates.io/latest

我的服务代码:

从 DevTools 网络选项卡中,我可以看到请求成功并且我得到了一个 JSON 对象:

在此处输入图像描述

但是我得到以下异常,我无法正确订阅响应:

在此处输入图像描述

我进行 JSONP 调用的方式有问题吗?还是服务器回答了问题(JSON 而不是回调)?为了完整起见,我使用 Angular 7 和 Angular CLI。