关于Angular的问题（不要与AngularJS混淆），来自Google的Web框架。将此标记用于Angular问题，这些问题并非特定于单个版本。对于较旧的AngularJS（1.x）Web框架，请使用angularjs标记。
我有一个带有两个按钮的模态：一个位于标题中，一个位于模态主体中。目前，当模式打开时，焦点会自动转到模式主体中的按钮，但我希望它集中在...
如何处理 Angular 和 mongoose 之间的 mongodb id？
由于 Typescript 的强类型，我将 Mongodb 的 _id 作为角度字符串传递。例子： 公共 setSelectedProduct = async (productId: string) => {...} 当我将productId传递给ba时...
这是我第一次尝试异步表单验证器。它附加到我的表单的 asyncValidators 上，它正确触发，返回正确的值（对象或 null）...但是表单
Angular2：@ContentChild - 仅直接子级
因此，为了更好的说明，我们将简化并尽量简洁。 我的手风琴 因此，为了更好的说明，我们将简化并尽量简洁。 <my-accordion> <my-title>My accordion</my-title> <my-accordion-item> <my-title>My accordion item 1</my-title> <my-content>Content 1</my-content> <my-accordion-item> <my-accordion-item> <my-title>My accordion item 2</my-title> <my-content>Content 2</my-content> <my-accordion-item> </my-accordion> 如您所见，我对 my-accordion 和 my-accordion-item 使用（我的）标准 my-title 所以在我的手风琴组件中我有逻辑 private title:string = ''; @ContentChild( myTitle ) myTitle: myTitle; ngAfterViewInit(){ if(this.myTitle && this.myTitle.content.length !== 0){ this.title = this.myTitle.content; } } 所以，如果我的视图与之前的示例完全相同，那么它就可以工作......并且返回的标题是“My Accordion”，但是，如果我的根目录上没有 my-title 元素我的手风琴......像这样： <my-accordion> <my-accordion-item> <my-title>My accordion item 1</my-title> <my-content>Content 1</my-content> <my-accordion-item> <my-accordion-item> <my-title>My accordion item 2</my-title> <my-content>Content 2</my-content> <my-accordion-item> </my-accordion> 标题将设置为“My Accordion item 1”，因为它获取整个 DOM 子树中的第一个 my-title 有没有办法只检查直系孩子？ @ContentChild() 不会，但 @ContentChildren() 会 https://angular.io/docs/ts/latest/api/core/index/ContentChildren-decorator.html @ContentChildren( myTitle, {descendants: false}) myTitle: QueryList<myTitle>; ngAfterContentInit() { console.log(this.myTitle.toArray()[0]); } 另请参阅 angular 2 / typescript ：获取模板中的元素 2024 年 12 月：现在可以（自 Angular 14 起）使用 @ContentChild() 使用 {descendants: false} 仅获取直接子级（如果存在）。
如何在 ng 服务代理中添加自定义标头（Angular 18+）
在我的 Angular 18 应用程序中使用 ngserve 时，我尝试向代理请求添加自定义标头。我尝试过以下配置： // 代理.config.js 常量 proxyConfig = { “/api/v1”...
泳道 ngx-datatable 没有现成的单独过滤功能。那里没有太多的解决方案。我一直致力于通过复选框过滤该列。如果复选框是
使用 docker 在 Kubernetes 上部署时管理 Angular 应用程序中的环境变量
编译时配置有限制 在某些场景下（例如 CI/CD 管道或容器化环境），每次环境发生变化时重新构建应用程序可能会很不方便...
我有一个父 Angular 组件，其中包含多个子组件。我需要跟踪从父组件及其子组件发出的所有 API 调用，但我想排除 API ca...
如何将模块/组件捆绑到js并在另一个Angular项目中使用？
我只是想构建一个模块/组件并将其作为 JS 包提供。它构建： @成分（{ 选择器：'应用程序组件概述'， 模板：' 我只是想构建一个模块/组件并将其作为 JS 包提供。它构建： @Component({ selector: 'app-component-overview', template: '<button><ng-content></ng-content></button>', }) export class ButtonComponent {} @NgModule({ declarations: [ButtonComponent], }) export class AppModule {} 问题是在将其构建为 javascript 包之后。当我尝试将其导入另一个角度项目时。我得到： //ERROR in ... error TS2306 '...' is not a module. loadChildren: () => import('...').then(m=>m.ButtonModule) 也许我错过了这里的重点，事情在角度上有所不同，拥有 webpack 控制使它变得更容易，但我想避免引入自定义构建器并尽可能少地摆弄设置。 问题是，是否有一个有据可查的方法来捆绑模块甚至独立组件以作为 JS 捆绑在我的项目之外使用？除了同一项目中已经存在的重用和延迟加载的高级解释之外，我找不到任何有用的东西。 您似乎正在将此模块构建为应用程序的一部分，该应用程序应该在浏览器中运行。但您正在寻找的是将此模块构建为库的一部分，可以在其他项目中重复使用。 请参阅此官方 Angular 指南，了解如何创建库。 经过几个小时的浏览。我明白了。 @json-derulo 给出的答案是解决方案的一部分，但还有更多步骤可以实现此目的。 遵循指南：https://angular.io/guide/creating-libraries 这是棘手的部分，如果您将库导入到工作区中，它将可以工作。但这没有多大意义。您可能有另一个带有角度应用程序的存储库，您想要使用该库。 现在能够将此组件作为延迟加载的路由导入，您需要将“@angular/router”添加到 lib peerDependecies 中并再次运行 npm install 现在创建一个路由模块并添加空路径以指向库中的组件。 //my-lib-routing.module.ts import { NgModule} from "@angular/core"; import { RouterModule } from "@angular/router"; import { MyLibComponent } from "./my-lib.component"; const routes= [ { path: '', component: MyLibComponent }, ]; @NgModule({ imports: [ RouterModule.forChild( routes, ) // other imports here ], // providers: [RouterModule], exports: [RouterModule] }) export class myLibRoutingModule { } 更改libmodule以导入路由模块 // import { NgModule } from '@angular/core'; import { myLibRoutingModule } from './my-lib-routing.module'; import { MyLibComponent } from './my-lib.component'; @NgModule({ declarations: [MyLibComponent], imports: [ myLibRoutingModule ], }) export class MyLibModule { } 在 lib 项目根目录上运行“npm run build”。 创建一个单独的存储库和“ng new app” 将 lib 添加到主应用程序的 package.json 中，例如 "my-lib": "../my-lib-ws/dist/my-lib"。 打开 angular.json 并将 "preserveSymlinks": true 添加到构建选项中。 运行 npm i 将库链接为依赖项。 将 libmoudle 添加为延迟加载路由 import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; const routes: Routes = [ {path: 'test', loadChildren: () => import('my-lib').then(m=>m.MyLibModule)} ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule] }) export class AppRoutingModule { } 运行 npm run start。并尝试访问“测试”路线。您应该看到主应用程序路由器中加载的组件已输出 现在，这更多的是学习练习，捆绑包几乎翻了一番。使用模块联合你会获益更多。但这是我们的一个用例。无论如何，步骤在这里，如果有人无法重现，请告诉我。 您想要做的是创建一个 Angular 自定义 Web 组件。 我在这里找到了一个关于如何执行此操作的很棒的教程： https://blog.kalvad.com/export-your-angular-component-as-a-web-component/ 将其升级到最近的 Angular 对我来说非常顺利。 如果您遇到任何挑战，我将发布一个更新的示例。
无法导入 Angular Material v15 预构建遗留主题
我将 Angular 和 Material 更新到了 v15，并且我想使用旧版组件，但是当我尝试导入旧版预构建主题时，出现此错误。 如果我导入材料预建主题（不是遗留主题...
我使用 Angular 8 创建了一个 Angular 应用程序。我正在努力在 Google 上引用我的网站。我在项目的路径中添加了 sitemap.xml 和 robots.txt，但是当我尝试访问时...
升级到 Angular 10 后无法在 scss 中的 url() 中使用资源
我将 Angular 应用程序从 v9 升级到 v10。几乎一切正常，但我在 url("assets/images/some/path/image.png") 中使用的所有图像开始抛出异常 - ./sr 中出现错误...
在使用 *ngFor 迭代对象时，我陷入了如何在 Angular 中获取对象的键和值的问题。 界面： 导出接口自定义列{ [键：字符串]：布尔值 } 应用程序组件...
Angular 代码编译良好，但在 VS Code 中出现许多红线
我已经在我的系统中导入了一个项目。尽管我能够编译和运行该项目，但我仍然收到模块和指令的红线。 我已经在导入中导入了必要的模块...
我有一个带有布尔属性的组件，默认值为 true 当我尝试将它的属性显式设置为 false 时，它仍然会获得 true 值。 选择.组件.ts： @成分（{
Angular 应用程序的Web.Config 重写规则来处理无效文件/目录
我有一个针对角度应用程序的 web.config 重写规则设置，如下所示 我有一个用于角度应用程序的 web.config 重写规则设置，如下 <rule name="Angular" stopProcessing="true"> <match url="^(?!^bff).*" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> </conditions> <action type="Rewrite" url="/" /> </rule> 问题：问题是 Angular 允许对不存在的文件的请求返回 200 OK 状态，导致应用程序因无法处理请求而挂在当前路由上。 例如： http://domain/svg/fileexist.svg - 文件存在并返回状态 200 http://domain/svg/filenotexisit.svg - 文件不存在，但已通过状态 200 并且应用程序挂起 预期结果： Angular 应用程序应继续允许对文件和目录的请求，但如果请求无效文件或目录，则应返回 404 状态。 例如： http://domain/svg/fileexist.svg - 文件存在并返回状态 200 http://domain/svg/filenotexisit.svg - 文件不存在，应返回状态 404 观察： 此行为在本地运行的基本 Angular 17 应用程序中可以正常工作。但是，当 Angular 应用程序托管在具有指定 web.config 重写规则的 IIS 上时，IIS 无法正确处理无效文件请求。 请求帮助：任何有关如何解决这种情况的建议将不胜感激。 http://domain/svg/filenotexisit.svg - 文件不存在，但通过状态 200 并且应用程序挂起 我不确定您的实际测试 URL，但我猜该 URL 也与规则中的表达式匹配，因此它执行重写操作，这会更改响应。 您配置的URL是/，可能指向一些默认页面（已有的，如index.html、default.html），所以返回200，请检查一下。 如果我误解了某些内容，请提供更多详细信息，例如重现问题的最小示例。
DevTools 无法加载响应数据。未找到具有给定标识符的资源的数据
我有一个带有 .NET Core 服务器的 Angular 应用程序。从网络屏幕上的开发工具中，我试图查看有请求的响应。这个请求工作正常，它返回数据（很好......
npm 错误 TAR_BAD_ARCHIVE：无法识别的存档格式
我正在从角度代码构建docker图像。下面是我的 Dockerfile。 FROM 节点：22-slim AS 构建 工作目录/应用程序 RUN rm -rf node_modules package-lock.json && npm 缓存清理 --force &&...
我正在尝试学习使用 Angular CDK 并在我的应用程序中创建一些组件。 该应用程序仅使用 tailwindCSS 和 daisyUI 元素插件。 我正在尝试获得独立的基本菜单
为什么会这样，因为要将 typesccript 转译为 javascript，我们需要 tsc，到目前为止一切都很好，但是我们在浏览器中运行转译后的代码而不是在本地，所以为什么我们需要在安装之前安装 Node js