angular-components 相关问题

组件控制称为视图的屏幕补丁。组件装饰器允许您将类标记为Angular组件，并提供其他元数据，以确定如何在运行时处理，实例化和使用组件。

我正在尝试使用 Angular 中的垫按钮切换组件构建如下组件。\ 状态.component.html 我正在尝试使用 Angular 中的垫按钮切换组件构建如下组件。\ status.component.html <div> <div> <input id="status1" type="radio" name="status-item" (change)="onSelectStatus($event)"> <label for="status1"> <div class="row"> <div class="col-md-8"> Status 1 </div> <div class="col-md-4"> <mat-button-toggle-group class="status" name="status" (change)="onToggle($event)" > <mat-button-toggle value="pass">Pass</mat-button-toggle> <mat-button-toggle value="n/a">n/a</mat-button-toggle> <mat-button-toggle value="fail">Fail</mat-button-toggle> </mat-button-toggle-group> </div> </div> </label> </div> <div> <input id="status2" type="radio" name="status-item" (change)="onSelectStatus($event)"> <label for="status2"> <div class="row"> <div class="col-md-8"> Status 2 </div> <div class="col-md-4"> <mat-button-toggle-group class="status" name="status" (change)="onToggle($event)" > <mat-button-toggle value="pass">Pass</mat-button-toggle> <mat-button-toggle value="n/a">n/a</mat-button-toggle> <mat-button-toggle value="fail">Fail</mat-button-toggle> </mat-button-toggle-group> </div> </div> </label> </div> </div> status.component.scss input[name="status-item"] { display: none; &:checked + label { background-color: green; } } 我要突出显示选定的行。当我单击一行时，它会突出显示。但是当我点击mat-button-toggle时，该行没有突出显示。我可以使用 onToggle 的 change 事件的 mat-button-toggle-group 功能突出显示所选行。但它只检测到改变状态。我想检测focus状态。不幸的是，除了 change 事件外，它不提供任何其他事件。有什么办法吗？

angular angular-material angular-components

回答 0 投票 0

为什么 Angular 组件的属性会被服务中实例化的计时器自动更新？

在我的 Angular 项目中，我定义了：服务 myService 一个组件 MainComponent 服务 myService 该服务包含一个计时器，该计时器在启动时更新属性 currentTime。

angular typescript angular-services angular-components

回答 0 投票 0

angular如何动态加载子组件视图到父组件视图

有什么方法可以将一个组件加载到另一个组件中。像这样的东西。父组件-ts 导出类 ParentComponent 实现 { childComponentsSelector:string = " 有没有办法将一个组件加载到另一个组件中。像这样的东西。父组件 - ts export class ParentComponent implements { childComponentsSelector:string = "<app-child-component></app-child-component>" } 父组件 - html <div> <div [innerHTML]="childComponentsSelector"></div> </div> 我尝试使用 innerHtml 属性，但它没有用，但我想实现类似的东西。正如其他人所说，基本答案看起来像动态组件，但是，在大多数情况下，使用动态组件会大大降低代码的可读性。作为替代方案，您可以使用 *ngIf 指令来实现类似的事情。您应该能够通过使用 *ngIf 指令销毁和创建子组件。您还可以从@angular/cdk 包中查看 CdkPortal： https://material.angular.io/cdk/portal

angular angular-components

回答 2 投票 0

$location.search() 相当于 Angular 7

我正在将 Angular JS 迁移到 Angular 7。我正在查看这段代码并尝试在 Angular 7 中实现。在服务中，注入了$location，下面的方法重置和设置查询

javascript angular angular7 angular-components

回答 2 投票 0

每个 Angular 模块的 ESLint 配置略有不同

在我们的 Angular 项目中，我们在他们自己的 Angular 库中有一些文件。这些库中的每一个都有自己的 .eslintrc.json 和 package.json，它们都是从我们的主要库扩展而来的，带有一些自定义

angular eslint angular-components

回答 0 投票 0

如何防止angular在生成组件时创建单元测试文件

是否有任何命令行参数可以帮助生成角度组件但不能创建单元测试文件

unit-testing angular-components

回答 1 投票 0

使用 Angular 生成组件不会使新组件全局可用

我正在尝试生成新组件，以便我可以将项目的不同部分分解为组件。使用 CLI 命令 ng g c components/test 将生成 .html、.scss、.spec.ts、...

angular angular-cli angular-components

回答 1 投票 0

将变量内容发送到其他（不相关的）组件 Angular

我正在尝试将变量的内容发送到不同的组件，因此我可以在另一个组件中使用该值（两个组件是不同的页面并且彼此不相关，但我不...

angular typescript angular-components angular15

回答 3 投票 0

在 Angular 14 中，如何在父元素的定义中引用嵌套的子元素？

我正在使用 Angular 14。我想构建自定义组件，以便父标记可以具有嵌套的子元素。所以例如，我想有你好我正在使用 Angular 14。我想构建自定义组件，以便父标记可以具有嵌套的子元素。例如，我想要 <app-my-parent> <p>Hello</p> </app-my-parent> 但我也想拥有 <app-my-parent> <app-my-child></app-my-child> </app-myparent> 但是我不确定如何创建“我的父”组件，以便我可以显示嵌套的内容。在 my-parent.copmonent.html 的定义中，我想要类似的东西 <div>Howdy, these are the nested contents</div> <div>{{ nestedContents }}</div> And here they are again! <div>{{ nestedContents }}</div> 但我不知道该怎么做。

angular nested angular-components angular14

回答 0 投票 0

为什么 News API 在 HTML 页面上不显示任何内容，但在 console.log 上返回数据

我怀疑 for 循环可能需要时间来显示？不太确定为什么不显示这是 news.component.html 我怀疑 for 循环可能需要时间来显示？不太确定为什么不显示这是news.component.html <div *ngFor="let article of articles"> <h2>{{article.title}}</h2> <p>{{article.description}}</p> <a href="{{article.url}}">Read full article</a> </div> 这是 data.service.ts import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; @Injectable({ providedIn: 'root' }) export class DataService { apiKey = 'xxx'; get(){ return this.httpClient.get(`https://newsapi.org/v2/top-headlines?sources=techcrunch&apiKey=${this.apiKey}`); } constructor(private httpClient: HttpClient) { } } 这是 news.component.ts import { Component, OnInit } from '@angular/core'; import { DataService } from '../data.service'; @Component({ selector: 'app-news', templateUrl: './news.component.html', styleUrls: ['./news.component.css'] }) export class NewsComponent implements OnInit { articles:any; constructor(private dataService: DataService) { } ngOnInit(){ this.dataService.get().subscribe((data:any)=>{ console.log(data); this.articles = data['Articles']; }) } } 期望数据显示在 html 组件上，但它显示空白目前它显示在 console.log(data) 首先：不要发布任何API Keys！然后：你的问题有点错字。 this.articles = data['articles']; articles小写。它会起作用。

angular api angular-components

回答 1 投票 0

Angular Nebular样式不适用于NbChatComponent。

我有一个正在进行的angular项目，我试图将nebular聊天UI添加到项目中。我用npm安装了nebular，并按照网站中提到的方法进行了导入。功能和预期一样，...

angular styles styled-components angular-components nebular

回答 1 投票 2

在新的浏览器窗口中打开Angular模板参考。

所以这里是我面临的问题的解释。它可能看起来非常类似其他已经问过的问题，但他们都没有回答我的问题。我想在......中打开一个Angular模板引用。

html angular angular-components

回答 1 投票 1

如何在Angular中从另一个服务中调用服务的特定实例？

所以我有一个组件 "motions"，它在用户输入某个按钮被点击后执行一个MotionService。那么这个服务需要将数据传递给特定的CaucusService实例的 ...