问题标签 [angular13]

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 投票
0 回答
28 浏览

angular - npm install 找到不存在的旧对等依赖项

我有一个普通的 Angular 项目和一个 Angular 库。
两者都曾经是 Angular 12,但今天我决定升级到 Angular 13。

我使用 Angular cli 的命令完成了这项工作,起初一切似乎都很好。
但是在尝试在我的 Angular 项目中安装该库后,我收到一条错误消息:

这个错误信息对我来说很奇怪,因为我都成功升级到了 Angular 13。包“my-library-project”没有对@angular/common@“^12.2.0”的任何引用。所有依赖项、对等依赖项、package.json 等都只有 Angular 13.1。

即使我在整个项目中搜索 "@angular/common@"^12.2.0" 我也找不到。
过了一会儿我尝试了以下事情:

  • 删除所有项目中的 node_modules 文件夹并再次 npm install
  • 清除 NPM 缓存
  • 删除 package-lock.json

但我仍然得到这个奇怪的错误。我不知道我还能在哪里搜索旧的 @angular/common 包。

有任何想法吗?

0 投票
1 回答
284 浏览

angular - Angular 将自己的库从 12 升级到 13 scss 错误“SassError:找不到要导入的样式表。”

我正在尝试将我的 Angular 项目从12升级到13,并遇到了一个我无法解决的问题,因为我已经工作了两天。

我的应用程序是默认的 Angular Material 应用程序,具有一些功能,例如购物清单应用程序。

要插入项目,我使用带有一些可以提交的字段的公式。(MatDialog) 我已经将这个公式外包到我自己的 Angular 库中,以便更通用和可重用。

现在,在升级库项目并尝试将生成的构建(来自新常春藤)链接到我的应用程序后,我收到了错误:

意味着未知的样式表来自库,并提供对该库的默认主题访问,但我无法确定为什么会发生这种情况。我也认识到,Angular Materialnow 的使用不再需要波浪号 ~。

我试图删除所有波浪号〜但错误仍然存​​在。

我还尝试重置@angluar/cli13.0.0 ,此处将其描述为解决方案。
但这对我不起作用。

有谁知道尝试的解决方案?

0 投票
1 回答
32 浏览

angular - Angular向component.html添加单引号和变量而不读取变量和引号

我正在使用 Angular 13,在我的 component.html 中我有这个:

这条线有效:

现在,当我有一个变量时:

并这样做:

或者

或者

以上3个不起作用,但第一个起作用。

如何使用该变量使其工作?

0 投票
2 回答
624 浏览

angular - 升级 Angular 应用的 npm 包后,sass-loader 不再工作

我刚刚从 Angular 12 升级到 Angular 13,还更新了其他一些 NPM 包。
其中之一包含我的 angular.json 文件中引用的 scss 文件。这从来都不是问题,但是在尝试为我的应用程序提供服务后,我收到一条我很难理解的错误消息:

这只是很长的错误消息的第一行,指出在许多文件中找不到“my-custom-package-layout/src/lib/styles/styles.scss”。
但是,如果我使用 Visual Studio 代码导航到那里,我不会收到错误,并且参考似乎很好。

这让我觉得 sass-loader 通常不再工作了。(第一行很长。看那里——它真的像这样!)
Angular 中的 sass-loader 是如何实现的?我无法重新安装 sass,因为它甚至没有在我的 package.json 中引用。
它是 Angular.cli 的一部分吗?

我可以尝试什么更接近解决方案?

如果我运行“npm rebuild node-sass”,我很快就会得到回复:

不用找了...

0 投票
0 回答
18 浏览

angular - 订阅组件中 forRoot 服务的值以获取页面级警报消息

我的要求是在页面上显示错误和成功的警报消息。我正在关注 stackblitz 演示https://stackblitz.com/edit/angular-9-alerts-mdhjed?file=app%2Fapp.component.html 并发现它可以显示同一页面的警报消息,但还不够。我还创建了 forRoot 模块,用于通过所有组件共享相同的服务。

在给定的例子

仅在 app.component.ts 文件中声明并且警报仅到达特定位置,但我希望它在不同的不同位置页面明智地显示在我的屏幕上。

IE

登录屏幕 - 标题
仪表板上方 - 表单下方等...

所以我放置 在基于设计的每个组件中,所有从同一组件发出但不工作的警报消息都来自另一个组件。

就像保存消息警报并重定向到另一个页面并在那里显示警报消息需要数据从一个屏幕传输到另一个屏幕,如下所示。

登录 .html

登录组件.ts

忘记密码 HTML

忘记密码组件

这种方式只有在另一个屏幕上的警报才有效,但这对于构造函数中的每个组件来说似乎是不必要的代码。

我想知道最好的解决方案。

0 投票
2 回答
100 浏览

angular - Angular 13 无法摆脱 Object 是可能的 null

我有一些包含这个的代码:

我不断得到:

object is possibly 'null'并尝试添加!到元素,但它仍然抱怨。

我怎样才能摆脱这个错误?

0 投票
0 回答
32 浏览

css - 角徽章定制

我添加了 mat-card 并在其中放置了图标。卡片和图标都分配了徽章。卡片的徽章是长字符串,图标的徽章是 1 位或 2 位数字。但是为卡片提供的徽章显示为 A... 我尝试为 mat-badge-content 提供 CSS。但不工作。此外,当我提供 matBadgeSize="small" 时,只有文本大小在减小。直径保持不变。

任何人都可以帮助设置垫卡徽章并减小图标徽章的直径。角度版本是 13.1。

0 投票
2 回答
73 浏览

angular - 如何使用 rxjs 链接 api 调用?

我知道有很多关于标题主题的问题,但我无法找到有助于我跟进的清晰简洁的问题/回复。

假设我们有 x 数量的 web api 调用返回 observables Observable<cs[]>... 见

函数restructureABCs()依赖于 as/bs & cs。因为,bs & cs 不相互依赖。当前的实现很丑陋,可以改进,但我不确定应该使用哪个运算符。使用 concatMap 对我来说没有意义,因为(根据我可能有缺陷的理解)多个流将被合并为一个,这是我不想要的。我只需要确保在调用restructureABCs()函数之前加载 as/bs & cs。

Angular13,rxjs7.4

0 投票
1 回答
61 浏览

angular - 引导程序 5 网格列中的 Angular *ngFor 循环不正确

我正在使用 Angular 13 和 Bootstrap 5 并尝试做一个循环,我在网格上得到 2 列。

数据是一个数组:

然后我有这个:

出于某种原因,我只在 1 列而不是 2 列中获得 4 张卡片......所以它在一列中给了我 4 个项目,我需要 2 行,每行 2 个项目。

我怎样才能做到这一点?

0 投票
0 回答
33 浏览

angular - Angular 赋予 State' 不可分配给类型 'ActionReducer' 错误

在此处输入图像描述

上面的错误是由 VSCode IDE 抛出的,

在尝试将减速器组合到一个文件中时。

我的动作看起来像

上面的IDE错误可以通过设置来action: Action修复import { Action } from '@ngrx/store'

但它会在从动作访问有效负载时抛出错误action.paylod(在减速器中)

无论如何action.type是可以访问的

任何形式的帮助将不胜感激