1) 在 Angular 14 中注入服务，无需使用构造函数注入。
以前，注入任何服务总是需要具有构造函数的类：
class MyClass {
constructor(private myService: MyService) {}
}
现在，我们可以在函数和类中注入服务。我们只需要声明一个变量并将其设置为等于注入其中的服务名称：
const myService = 注入(MyService);
这很有用，例如，在拦截器和防护中，它们现在通常使用函数而不是类来完成。
2) 在 Angular 15 中用于保存行的自关闭标签。
从这个版本开始，您可以使用带有单个标签的组件：
之前，需要打开和关闭组件标签才能使用它：
我的组件>
3) 通过创建快捷方式减少 Angular 中的导入。
而不是像这样长时间导入：
从 '../../components/my-component' 导入 { MyComponent };
您可以像这样缩短导入：
从 '@components/my-component' 导入 { MyComponent };
要实现此目的，请转到 tsconfig.json 文件并在 compilerOptions 属性下添加路径。在路径内部，您可以配置自己的导入快捷方式：
{
"compilerOptions": {
"paths": {
"@components/*": ["src/app/components/*"]
}
}
}
建议，如果您在某个组件内并且想要使用该组件特定的内容，请使用 ./ 相对导入它以访问该资源。但访问父文件夹时，请使用@快捷方式。如果出现问题，您可能需要关闭并重新打开 Visual Studio Code。这些小细节对于保持代码尽可能有条理非常重要。
4) 使用 Angular 15 中的 NgOptimizedImage 指令优化图像加载。
如果我们有一个包含 15 个图像的列表，并通常使用 [src] 迭代它们，我们将面临应用程序启动时一次加载所有 15 个图像的问题，这会降低性能：
为了解决这个问题，Angular 提供了 NgOptimizedImage 指令。要使用它，只需导入它：
从 '@angular/common' 导入 { NgOptimizedImage };
并使用 [ngSrc] 而不是 [src]。这将延迟加载图像，从而提高性能。然而，该指令还有许多其他配置。如果您只想延迟加载，我建议使用loading =“lazy”属性，该属性是HTML标准的一部分，并且与所有浏览器兼容：
建议：如果菜单顶部有主图像，请勿将其设置为延迟加载，因为它将在应用程序打开时第一个加载。仅将此应用于可能出现在滚动下方的图像，因为我们不需要立即加载它们。
这对于公共应用程序非常重要，例如需要良好 SEO 的 SSR 应用程序，因为它有助于提高性能。
— 基于 EfisioDev 的 Angular 课程的笔记 —
以上是Angular 和 15 的改进的详细内容。更多信息请关注PHP中文网其他相关文章！
