angular-leaflet-directive 相关问题


显示输入类型日期的占位符文本

占位符不适用于直接输入类型日期和日期时间本地。 占位符不适用于直接输入类型 date 和 datetime-local。 <input type="date" placeholder="Date" /> <input type="datetime-local" placeholder="Date" /> 该字段在桌面上显示 mm/dd/yyy,而在移动设备上则不显示任何内容。 如何显示 Date 占位符文本? 使用onfocus="(this.type='date')",例如: <input required="" type="text" class="form-control" placeholder="Date" onfocus="(this.type='date')"/> 使用onfocus和onblur...这是一个例子: <input type="text" placeholder="Birth Date" onfocus="(this.type='date')" onblur="if(this.value==''){this.type='text'}"> 在这里,我尝试了 data 元素中的 input 属性。并使用 CSS 应用所需的占位符 <input type="date" name="dob" data-placeholder="Date of birth" required aria-required="true" /> input[type="date"]::before { content: attr(data-placeholder); width: 100%; } /* hide our custom/fake placeholder text when in focus to show the default * 'mm/dd/yyyy' value and when valid to show the users' date of birth value. */ input[type="date"]:focus::before, input[type="date"]:valid::before { display: none } <input type="date" name="dob" data-placeholder="Date of birth" required aria-required="true" /> 希望这有帮助 <input type="text" placeholder="*To Date" onfocus="(this.type='date')" onblur="(this.type='text')" > 这段代码对我有用。只需使用这个即可 对于 Angular 2,你可以使用这个指令 import {Directive, ElementRef, HostListener} from '@angular/core'; @Directive({ selector: '[appDateClick]' }) export class DateClickDirective { @HostListener('focus') onMouseFocus() { this.el.nativeElement.type = 'date'; setTimeout(()=>{this.el.nativeElement.click()},2); } @HostListener('blur') onMouseBlur() { if(this.el.nativeElement.value == ""){ this.el.nativeElement.type = 'text'; } } constructor(private el:ElementRef) { } } 并像下面一样使用它。 <input appDateClick name="targetDate" placeholder="buton name" type="text"> 对于 React,你可以这样做。 const onDateFocus = (e) => (e.target.type = "datetime-local"); const onDateBlur = (e) => (e.target.type = "text"); . . . <input onFocus={onDateFocus} onBlur={onDateBlur} type="text" placeholder="Event Date" /> 我是这样做的: var dateInputs = document.querySelectorAll('input[type="date"]'); dateInputs.forEach(function(input) { input.addEventListener('change', function() { input.classList.add('no-placeholder') }); }); input[type="date"] { position: relative; } input[type="date"]:not(.has-value):before { position: absolute; left: 10px; top: 30%; color: gray; background: var(--primary-light); content: attr(placeholder); } .no-placeholder:before{ content:''!important; } <input type="date" name="my-date" id="my-date" placeholder="My Date"> 现代浏览器使用 Shadow DOM 来方便输入日期和日期时间。因此,除非浏览器出于某种原因选择回退到 text 输入,否则不会显示占位符文本。您可以使用以下逻辑来适应这两种情况: ::-webkit-calendar-picker-indicator { @apply hidden; /* hide native picker icon */ } input[type^='date']:not(:placeholder-shown) { @apply before:content-[attr(placeholder)]; @apply sm:after:content-[attr(placeholder)] sm:before:hidden; } input[type^='date']::after, input[type^='date']::before { @apply text-gray-500; } 我使用了 Tailwind CSS 语法,因为它很容易理解。让我们一点一点地分解它: ::-webkit-calendar-picker-indicator { @apply hidden; /* hide native picker icon */ } 使用其 Shadow DOM 伪元素选择器隐藏本机选择器图标(通常是日历)。 input[type^='date']:not(:placeholder-shown) { @apply before:content-[attr(placeholder)]; @apply sm:after:content-[attr(placeholder)] sm:before:hidden; } 选择所有未显示占位符的 date 和 datetime-local 输入,并且: 默认使用 placeholder 伪元素显示输入 ::before 文本 在小屏幕及以上屏幕上切换为使用 ::after 伪元素 input[type^='date']::after, input[type^='date']::before { @apply text-gray-500; } 设置 ::before 和 ::after 伪元素的样式。


React-Leaflet GeoJSON 工具提示出现在两个地方 - 如何修复?

我正在使用 React-Leaflet,并且遇到了 GeoJSON 层中的工具提示问题。我使用 onEachFeature 函数使用带有 Sticky: t...


Leaflet 图层控件出现在其他 z 索引较低的 div 后面

从截图中可以看出,Leaflet 图层控件出现在其他 div 的后面,而我希望它出现在它们的前面。 “Key”和“Participants”div 的 z-index 为 20。 传单


如何从react-leaflet Marker传递和获取额外的数据/值?

我正在使用react-leaflet向地图添加一组标记。目前我可以使用自定义图标在地图上显示标记。如何向每个标记添加数据记录。我想我必须以某种方式


在组件中添加传单的map.on('click', ...)会导致参数列表后出现语法错误:缺少 )

我在使用Leaflet和Svelte时遇到了一些奇怪的错误,我不确定这是否是我的错误。 我有一个封装我的 Leaflet 地图的组件,位于 Svelte 的 $lib 目录中。随时...


从 Angular 16 转换为 Angular 17 后缺少 SSR 支持

我已将我的项目从 Angular 16 升级到 Angular 17。但是,我目前没有收到服务器端渲染 (SSR) 的支持。从 Angular 16 迁移后,Angular 是否提供 SSR 支持...


“限制将街景标记添加到传单地图中的特定区域

我决定通过创建挪威夏季的公路旅行地图来开始学习 Leaflet 和 JavaScript,这是我的项目的可重复示例: 我决定通过创建挪威夏季的公路旅行地图来开始学习 Leaflet 和 JavaScript,这是我的项目的可重复示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick-theme.css"/> <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script> <link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine/dist/leaflet-routing-machine.css" /> <script src="https://unpkg.com/leaflet-routing-machine/dist/leaflet-routing-machine.js"></script> <style> body { margin: 0; } #map { width: 100%; height: 100vh; } .carousel { max-width: 300px; margin: 10px auto; } .carousel img { width: 100%; height: auto; } /* Custom styling for Geiranger popup content */ .geiranger-popup-content { max-width: 500px; padding: 20px; } </style> </head> <body> <div id="map"></div> <script> var map = L.map('map').setView([61.9241, 6.7527], 6); var streetViewMarker = null; // Variable to keep track of the Street View marker L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMap contributors' }).addTo(map); var roadTripCoordinates = [ [59.9139, 10.7522], // Oslo [62.2622, 10.7654], // Tynset [62.5949, 9.6926], // Oppdal [63.0071, 7.2058], // Atlantic Road [62.1040, 7.2054] // Geiranger ]; // Function to initialize Slick Carousel for a specific marker function initSlickCarousel(markerId, images) { $(`#${markerId}_carousel`).slick({ infinite: true, slidesToShow: 1, slidesToScroll: 1, dots: true, arrows: true }); // Add images to the carousel images.forEach(img => { $(`#${markerId}_carousel`).slick('slickAdd', `<div><img src="${img}" alt="Image"></div>`); }); } // Add markers for each destination with additional information and multiple pictures var destinations = [ { coordinates: [59.9139, 10.7522], name: 'Oslo', info: "../07/2023 : Start of the road-trip", images: ['https://www.ecologie.gouv.fr/sites/default/files/styles/standard/public/Oslo%2C%20Norvege_AdobeStock_221885853.jpeg?itok=13d8oQbU', 'https://via.placeholder.com/300', 'https://via.placeholder.com/300'] }, { coordinates: [62.2622, 10.7654], name: 'Tynset', info: "../07/2023 : Fly-fishing spot 1", images: ['https://www.czechnymph.com/data/web/gallery/fisheries/norway/glommahein/Kvennan_Fly_Fishing_20.jpg', 'https://via.placeholder.com/300', 'https://via.placeholder.com/300'] }, { coordinates: [62.5949, 9.6926], name: 'Oppdal', info: "../07/2023 : Awesome van spot for the night", images: ['https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSFRtpLlHWr8j6S2jNStnq6_Z9qBe0jWuFH8Q&usqp=CAU', 'https://via.placeholder.com/300', 'https://via.placeholder.com/300'] }, { coordinates: [63.0071, 7.2058], name: 'Atlantic Road', info: "../07/2023 : Fjord fishing", images: ['https://images.locationscout.net/2021/04/atlantic-ocean-road-norway.jpg?h=1100&q=83', 'https://via.placeholder.com/300', 'https://via.placeholder.com/300'] }, { coordinates: [62.1040, 7.2054], name: 'Geiranger', info: "../07/2023 : Hiking 1", images: ['https://www.fjordtours.com/media/10968/nicola_montaldo-instagram-26th-may-2021-0717-utc.jpeg?anchor=center&mode=crop&width=1120&height=1120&rnd=133209254300000000&slimmage=True', 'https://via.placeholder.com/300', 'https://via.placeholder.com/300'] } ]; // Use Leaflet Routing Machine with Mapbox Routing plugin to get and display the route L.Routing.control({ waypoints: roadTripCoordinates.map(coord => L.latLng(coord[0], coord[1])), router: L.Routing.mapbox('MAP_BOX_KEY'), draggableWaypoints: false, addWaypoints: false, lineOptions: { styles: [{ color: 'brown', opacity: 0.7, weight: 2 }] } }).addTo(map); // Remove the leaflet-routing-container from the DOM var routingContainer = document.querySelector('.leaflet-routing-container'); if (routingContainer) { routingContainer.parentNode.removeChild(routingContainer); } destinations.forEach(function (destination) { var marker = L.marker(destination.coordinates).addTo(map); var markerId = destination.name.replace(' ', '_'); marker.bindPopup(` <b>${destination.name}</b><br> ${destination.info}<br> <div class="carousel" id="${markerId}_carousel"></div> `).on('popupopen', function () { // Initialize Slick Carousel when the marker popup is opened initSlickCarousel(markerId, destination.images); }).openPopup(); }); // Add Street View panorama on map click map.on('click', function (e) { if (streetViewMarker) { // Remove the existing Street View marker map.removeLayer(streetViewMarker); } let lat = e.latlng.lat.toPrecision(8); let lon = e.latlng.lng.toPrecision(8); streetViewMarker = L.marker([lat, lon]).addTo(map) .bindPopup(`<a href="http://maps.google.com/maps?q=&layer=c&cbll=${lat},${lon}&cbp=11,0,0,0,0" target="blank"><b> Cliquer ici pour avoir un aperçu de la zone ! </b></a>`).openPopup(); }); </script> </body> </html> 一切都按预期进行,我不得不说我对渲染非常满意。然而,通过查看 Stackoverflow 上的不同主题,我发现可以通过单击地图来显示 Google 街景视图。这个功能真的很酷,但我想限制仅在我的公路旅行行程中添加街景标记的选项。 有人可以帮我吗? 您通过创建挪威夏季公路旅行地图开始了学习 Leaflet 和 JavaScript 的旅程,真是太棒了。到目前为止,您的项目设置看起来不错,我很乐意在您的进展过程中提供指导或帮助。 既然您已经包含了 Leaflet、Slick Carousel 和 Leaflet Routing Machine 库,看来您正计划使用 Slick Carousel 创建一个带有路线的交互式地图,也许还有一些附加功能。 以下是一些增强您的项目的建议: 地图初始化: 使用初始视图和要显示的任何特定标记或图层设置您的传单地图。 路由功能: 利用 Leaflet Routing Machine 将动态路线添加到您的地图。您可以自定义路线、添加航点并提供逐向指示。 照片轮播: 既然您提到了公路旅行地图,请考虑集成 Slick Carousel 来展示旅途中关键地点的照片或描述。这可以为您的地图添加视觉上吸引人的元素。 地图控制: 探索 Leaflet 插件或内置控件以增强用户体验。例如,您可以添加缩放控件或比例尺。 响应式设计: 确保您的地图能够响应不同的设备。 Leaflet 通常适合移动设备,但如果需要的话进行测试和调整是一个很好的做法。 数据层: 如果您有与您的公路旅行相关的特定数据点或事件,您可以使用标记或其他视觉元素在地图上表示它们。 JavaScript 交互性: 使用 JavaScript 为地图添加交互性。对于 ㅤ 实例,当用户单击标记时,您可以创建包含附加信息的弹出窗口。 记得迭代测试你的项目,并参考每个库的文档以获取详细的使用说明。 如果您有具体问题或在此过程中遇到挑战,请随时提问。祝您的公路旅行地图项目好运!


React 应用程序中的地图显示不正确

我正在尝试使用react-leaflet将地图对象插入到我的React应用程序中,但我在下面的屏幕上得到了这样的结果。 在此输入图像描述 所以这是我使用的代码...


Angular CLI 版本与 Angular Core 版本之间的兼容性?

有什么方法可以知道要安装哪个与我的 Angular Core 版本兼容的 Angular CLI 版本?他们完全独立吗? 使用 Core v5.2.8 开发现有的 Angular 应用程序...


使用具有反应性值的 leafletProxy 函数时,R leaflet 不会渲染地图

我正在尝试创建一个传单地图,当用户更改选择时,该地图将更新而不会重新绘制。 我有一个数据框 testDF,其中包含城镇名称、纬度、经度和 popn 变量。我想要...


Angular 17 中的 NG 块 UI

我尝试在 Angular 17 中使用 NG Block UI 并收到此错误 ng block ui error in Angular 17 知道这个模块在 Angular 17 中如何工作吗? 提前致谢 我使用 npm i ng-


Angular Material v17:缺少“MatFormFieldAppearance”中的“遗产”

在 Angular Material v14 中,MatFormFieldAppearance 提供了传统、标准、填充和轮廓值。 类型 MatFormFieldAppearance = '旧版' | '标准' | '填充' | '大纲'; 然而,在 Angular


Angular“ng 生成组件”复制组件

由于某种原因,自从从 Angular 13 升级到 Angular 15 后,当我输入: ng g c 某些组件 Angular 复制组件,创建重复文件。这种情况 100% 都会发生。第二次...


如何使用 Angular 服务创建 nx 库

我有几个 Angular 应用程序在 nx 工作区中运行。所有这些应用程序都使用 Angular Material 对话框。为此,我通常创建这样的 Angular 服务: 导入 { 管理组件 }


Angular-NG8001 未知元素错误。怎么解决?

我的 Angular 项目有问题。我有一个项目结构:应用程序结构。在我的 app.module.ts 中,代码如下: 从'@angular/core'导入{NgModule}; 从'@


Angular 项目不适用于@babylonjs/viewer

我在全球安装了@Angular/[email protected]。我使用命令行“ng new BabylonTest --routing false --style css --skip-git --skip-tests”创建了一个 Angular 项目。 CD 到文件夹“Babyl...


使用模块联盟进行 Angular 升级 - “集合没有原理图。”

我正在将一组 Angular 应用程序从 v12 升级到 v16,它们使用模块联合和 Angular Architects 的模块联合插件。 成功升级每个应用程序的 Angular 版本后...


Node Sass 版本 9.0.0 与 ^4.0.0 不兼容

我的应用程序中没有安装node-sass或sass包。但我一直收到这个错误 ./src/scss/styles.scss 中的错误(./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plu...


放大init UnauthorizedException

我正在使用以下文档学习放大器 https://docs.amplify.aws/angular/start/getting-started/installation/ https://docs.amplify.aws/angular/start/getting-started/setup/ 但同时


登录后,使用 angular-oauth2-oidc 时,hasValidAccessToken 始终为 true

我已经使用 Angular 12.2 实现了 angular-oauth-oidc (版本 12.1.0)。我使用 Keycloak 作为 SSO 登录没有问题,但我在库中遇到了奇怪的行为。 每次,之后...


通过Angular到Springboot访问POST失败但GET成功,Postman适用于GET和POST

我正在使用示例 Angular 应用程序来测试 Okta 与 springboot 应用程序的集成。 前端示例:https://github.com/okta-samples/okta-angular-sample 我有一个带有


类型“string”无法分配给类型“FormGroup<any>”Angular 14 错误

我是一名初学者 Angular 开发人员,我正在使用本教程构建一个 todoList 应用程序 -> https://www.youtube.com/watch?v=WTn2nVphSl8 它是使用 Angular 13 完成的。我遇到错误的是我...


如何使最新的 Angular 版本与旧浏览器兼容?

Angular 在其文档中声明,它与所有主要浏览器的 2 个最新版本(以及 Firefox 的最新+ESR)兼容。由于 Angular 在底层使用标准 DOM API,因此它应该...


Angular Material 17 独立组件中没有 DateAdapter 的提供者

我有一个带有 Angular 17 应用程序的 nx 项目,并尝试使用带有材料 17.0.4 的 Angular 材料日期选择器。但我明白了 NullInjectorError:没有 DateAdapter 的提供者! 错误。组件...


应用程序无法识别手势,例如在 Angular 11 中使用 Hammer.JS 进行平移

我无法在使用 Hammer.JS 的 Angular 应用程序中识别任何手势,例如滑动、平移。它的设置是这样的: 包.json: “@角度/核心”:“11.0.5”, “@Angular/platform-br...


如何让新的 Angular 17 项目运行?

全新安装 Nodejs (20.10.0) 和 Angular (17.0.8)。新项目(“ng new Default”),没有文件更改。 “ngserve”没有错误,但浏览器控制台显示: main.ts:5 错误


为什么我的应用程序根目录在 Angular 中不是 100% 高度?

这是我的第一个 Angular 项目,我对 Web 开发还很陌生。我正在使用 Angular 17.0.9。 我希望我的应用程序为 100%,但应用程序根标签始终是可能的最小高度 当你...


Angular Material 5 深色主题未应用于机身

我创建了一个“自定义”主题(使用 https://material.angular.io/guide/theming 上的主题文档,这非常糟糕),如下所示: @import '~@angular/material/theming'; @包括 mat-cor...


Angular 17:fileReplacements 不替换文件

我有一个 C#/Angular 17 SPA 项目,在具有多个部署槽的 Azure 应用服务上的 Docker 容器中运行。基本上,生产槽加载标记为“latest-prod”的图像......


Angular 12:Firebase 模块未正确提供(?)

第一次使用Firebase,所以我不知道发生了什么。我没有修改使用 ng add @angular/fire 获得的配置,所以我的 AppModule 中的内容是: @NgModule({ 声明:[


如何将 swiper 11.0.5 元素与 Angular 17 一起使用

在 Angular 17 中,一切都是独立组件,并且没有 app.module.ts 文件。那么,我们把这段代码放在哪里, 从“swiper/element”导入{register}; 登记(); 我正在...


NG8001:“app-welcome”不是已知元素:

我的 Angular 应用程序遇到问题,收到错误 8001。我不知道如何处理它。谁能帮我这个?谢谢你! 应用程序组件.html {{标题}}&l... 我的 Angular 应用程序遇到问题,收到错误 8001。我不知道如何处理它。谁能帮我这个?谢谢! app.component.html <h1>{{ title }}</h1> <p>Congratulations! Your app is running. 🎉</p> <app-welcome></app-welcome> app.component.ts import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterOutlet } from '@angular/router'; @Component({ selector: 'app-root', standalone: true, imports: [CommonModule, RouterOutlet], templateUrl: './app.component.html', styleUrl: './app.component.css' }) export class AppComponent { title = 'XYZCARS'; } welcome.component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-welcome', templateUrl: './welcome.component.html', styleUrl: './welcome.component.css' }) export class WelcomeComponent { car = 'toyota'; } 我的项目最初没有 app.module.ts 文件。我自己添加了它并根据网上找到的一些信息进行了配置,但问题仍然存在并且仍未解决。谁能帮我解决这个问题吗? app.module.ts import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { WelcomeComponent } from './welcome/welcome.component'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent, WelcomeComponent ], imports: [ BrowserModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } 如果您正在 Angular 17 中创建项目->使用这些命令 ng app --no-standalone 然后你就得到了 app.module.ts 文件。


在 Angular 的输入标签中使用值

我目前正在开发 Angular 前端。 我想使用由我正在合作的团队创建的组件,该组件用于在表单中创建输入文本。 该组件的 .html...


当element在element上使用迭代变量时如何重构ngFor?

我有这个 {{ dt }} 我想重构为 Angular v17


Angular 复选框:更改未正确反映

我在 Angular 项目中面临一个问题,其中选项表单中有多个复选框。问题是有时复选框中的更改无法正确反映。这是相关内容...


Angular:如何将管道与位置结合使用

在 Angular 中,位置是“应用程序可以用来与浏览器 URL 交互的服务”。 它提供了一个 getState() 方法,该方法提供“位置历史记录的当前状态&


选中/取消选中 mat-checkbox 未正确返回 true 或 false

我正在使用 Angular 15 和 Angular Material 14,下面是我用来显示复选框列表的 HTML 代码 我正在 Angular 15 和 Angular Material 14 工作,下面是我用来显示复选框列表的 HTML 代码 <div *ngFor="let control of checkboxArray.controls;let i = index" > <mat-checkbox [formControl]="control" (input)="validateInputs(notificationForm)" [checked]="control.value" (change)="control.checked=$event.checked;onCheckedChange(i);"> {{ checkboxItems[i].name }} </mat-checkbox> </div> 下面是Angular中onCheckedChange函数的代码 onCheckedChange(index: number) { this.sortCheckboxArray(); const checkboxItem = this.checkboxItems[index]; const control = this.checkboxArray.at(index); if (control) { if (control.value) { this.lists.push(checkboxItem.id.toString()); } else { this.lists.pop(checkboxItem.id.toString()); } } this.updateSubscriberGroupsCount(); this.cdr.detectChanges(); } 当我选中复选框时,在这个 onCheckedChange 函数中,control.value 始终返回 false。哪里出了问题?无法理解.. 这是一个工作版本,复选框逻辑工作正常,希望有帮助! 我们需要使用control.value获取表单组,但我们还需要访问内部表单控件,然后获取复选框值! import { CommonModule } from '@angular/common'; import { Component } from '@angular/core'; import { FormArray, FormControl, FormGroup, ReactiveFormsModule, } from '@angular/forms'; import { bootstrapApplication } from '@angular/platform-browser'; import 'zone.js'; import { MatCheckboxModule } from '@angular/material/checkbox'; @Component({ selector: 'app-root', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatCheckboxModule], template: ` <form [formGroup]="form"> <div formArrayName="array"> <div *ngFor="let control of checkboxArray.controls;let i = index" [formGroupName]="i"> <mat-checkbox formControlName="test" style="margin-bottom: 15px;" (change)="onCheckedChange(i);"> {{ checkboxItems[i].name }} </mat-checkbox> </div> </div> </form> `, }) export class App { name = 'Angular'; form = new FormGroup({ array: new FormArray([]), }); lists = []; checkboxItems: any = []; ngOnInit() { this.add(); this.add(); this.add(); } add() { this.checkboxArray.push( new FormGroup({ test: new FormControl(false), }) ); this.checkboxItems.push({ name: 'test' }); } get checkboxArray() { return this.form.get('array') as FormArray; } onCheckedChange(index: number) { // this.sortCheckboxArray(); // const checkboxItem = this.checkboxItems[index]; const control = this.checkboxArray.at(index); if (control) { if (control.value.test) { console.log('checked'); // this.lists.push(checkboxItem.id.toString()); } else { console.log('not checked'); // this.lists.pop(checkboxItem.id.toString()); } } // this.updateSubscriberGroupsCount(); // this.cdr.detectChanges(); } } bootstrapApplication(App); 堆栈闪电战


Angular 中的 JavaScript 函数“未定义”错误

我正在尝试让 Angular 17 项目正常运行。我正在使用 Bootstrap (5),并尝试让 datePicker 工作。这需要一些 JavaScript 代码,但我无法使用这些代码。我已经关注了...


@types/ws 尝试从角度 12 更新到角度 13 时出现错误

我已将我的项目从 Angular 12 更新为 Angular 13,但遇到此错误: 错误:node_modules/@types/ws/index.d.ts:328:18 - 错误 TS2315:类型“服务器”不是通用的。 328服务器?:


如何在 Angular 17 中添加插值而不转义 URL 编码?

我想添加一个routeLink,其中使用Angular插值在字符串中定义完整的URL值,但是当页面执行时,它会转义URL。 预期:http://localhost:4200/books?page=3&sort=...


office 插件中的 Redux DevTools

我正在开发一个使用 Angular 15 的 Excel 插件,在 Angular 应用程序中,我刚刚添加了 @ngrx/store。我也将开发工具添加到了模块中。我注意到 Excel 使用 Edge 来运行该加载项。


如何在 Angular Material 2 中构建自定义组件

是否有任何标准方法可以在 Angular Material 2 之上构建自己的组件或扩展现有组件。 之前我使用过 Sencha/ExtJS 框架,构建自己的框架非常简单


Angular 10 ssr 不适用于请求 API

在一个项目中,我安装了 SSR 的 Angular Universal,并使用 Firebase 托管和功能进行部署。 对于静态文本和图像资源,我在生产中获取了用于 SEO 的内容,但是对于...


如何在Angular单元测试中正确获取子组件实例?

我正在 Angular 中用 karma 编写单元测试,但我正在努力解决奇怪的问题。我正在尝试测试 source-roll-history.dialog.ts 内部的 app-source-roll-history-form 的输出取消....


有没有办法使用角度材料拖放来调整大小

我正在使用 Angular 和 Material 创建一个 Web 应用程序,我希望能够拖放和调整我的部分的大小。有没有办法使用 Angular Material 拖放 CDK 来完成?


将 Angular Material 从 16 迁移到 17 时出现目录错误

我正在尝试运行 Angular Material 迁移工具以从 16 迁移到 17,但收到一条错误消息,指出目录必须是字符串。 JSON 显示它是错误的。这不是提示,a...


在 Angular 15 升级中遇到加载器解析 ag-grid/angular.css 文件的问题

我在将 Angular 14 升级到 15 时遇到此构建错误。 我尝试添加 css 加载器,但没有用 ./node_modules/@ag-grid-community/styles/ag-grid.css?ngGlobalStyle:1:0 - 错误:模块解析失败...


Angular 6 嵌套 FormGroup 模板验证

我的表单组结构如下所示(order.component.ts): this.orderForm = this.formBuilder.group({ 客户:this.formBuilder.group({ 名称:['',验证器.required], 电话: ['',


如何在 Angular 16 应用程序中监听 javascript 回调

我正在尝试使用 iFrame 将我的 Angular 16 应用程序与第三方网站集成。我的问题是如何捕获来自他们网站的回调响应? 与其 API 集成的建议方法...


在 Jenkins 中部署 Angular 应用程序

我已经在 Jenkins 中为 Angular 应用程序创建了构建阶段,该阶段是成功的。我的要求是我需要将它部署到我随身携带的 Linux 服务器上,并且应用程序应该得到


© www.soinside.com 2019 - 2024. All rights reserved.