标签: angular7

我有一个数组用户:

[0: {id:123, firstname:'xyz', lastname:'abc'}, 1:{id:456, firstname:'foo', lastname:'bar'}, 3:{id:567, firstname:'bar', lastname:'baz'}]

我必须循环遍历此数组并调用服务API以获取用户约会.

方法1 ,我觉得这不是最佳实践,但解决问题

let userAppointments = []
  for (let user of this.users) {

    this._service
      .getUsersAppointments(
        {
          date: this.todayDate,
          id: user.id
        },
        this.token
      )
      .subscribe(res => {

       // Modifying array as per requirements-----

        userAppointments.push({
          id: user.id,
          name: `${user.firstname} ${user.lastname}`,
          appointments: res
        });
      });

  }

  this.appointments = userAppointments 

方法2:使用forkJoin

问题:当我最终得到所有呼叫的响应时,我无法访问用户的名字和姓氏.我需要在我的最终数组this.appointments中的那些细节,即在我分配的地方调用subscribe之后res to this.appointments

        forkJoin(
    this.users
      .map(res =>
        this._service.getUsersAppointments(
          {
          date: this.todayDate,
          id: res.id

          },
          this.token
        )
      )
      .map(response => …

我正在玩Angular的（版本7）内容投影。据我所知，可以按属性，类和带有select属性的标签进行选择<ng-content>。

我也尝试通过ID选择：

<ng-content select="#myID"></ng-content>

从：

<mycomponent>
   <div id="myid">
        Test
   </div>
</mycomponent>

但这似乎不起作用。

为什么选择ID无效？

是否有与网格列表配合使用的虚拟滚动实现？我认为默认实现不会起作用，因为每一行周围都应有一个元素。

我正在使用网格列表显示个人资料图片，并且需要无限滚动或最好是虚拟滚动才能加载新的图片。

我创建了一个自定义的打字稿定义文件（brat.d.ts）

export declare class head {
   ready(callback: () => any);
}

export declare class Util {
   static embed(divId: string, collData: any, docData: any, webFontsURLs: Array<string>);
}

我正在像这样在Angular 7组件中导入上述定义文件

import {head, Util} from "../../brat/brat";

当我上菜时，出现以下错误

'在./src/app/folder-mgmt/list-documents/list-documents.component.ts中 找不到错误：错误：无法在'\ src \中解析'../../brat/brat' app \ folder-mgmt \ list-documents'`

有人可以建议我做错了什么吗

当我ng build在dist文件夹中通过命令构建项目时，我js同时拥有所有其他资源的文件，但是我想将所有图像和字体移动到单独的文件夹中，例如assets。有谁能够帮助我？

更新：angular.json "assets": [ "src/favicon.ico", "src/assets" ],

在组件的scss中，我有：

background-image: url('assets/img/no-notifications.svg');

但结果我进入了dist文件夹下一个文件：

no-notifications.7e08682a570485d1c108.svg

目标是保持图像路径与在scss文件中指定的图像路径相同： assets/img/no-notifications.svg

我有一个要求，我必须使用ts的十进制管道来转换数字

而不是像这样使用十进制管道

<td>{{rmanFmvRulesDef.max  | number :'1.2-2'}}</td>

我想从组件中操作它，有人可以帮助我吗？

我刚刚开始在Angular应用程序中使用Angular Material主题。

我使用了一些单选按钮，但希望对其进行样式设置，以使其比平时小。我可以设置文本标签的样式，但是我正在努力设置实际按钮的样式（圆圈）。

所以现在，我有

<mat-radio-group class="smallRadio">
    <mat-radio-button value="1">Option 1</mat-radio-button>
    <mat-radio-button value="2">Option 2</mat-radio-button>
</mat-radio-group>

我该怎么办？

Ionic 4现在使用Angular路由器。尽管它仍然拥有自己的NavControler，它可以通过NavigationBackward和NavigationForward方法来模拟推/弹出导航样式。

我认为，为了显示离子后退按钮，有必要使用NavigationForward和NavigationBackward。

在我的应用程序中，我更喜欢使用routerLinks进行导航（以便用户可以在另一个选项卡中打开页面），而不是navController。

但是使用routerLinks时，不会出现离子后退按钮。必须有一种使routerLink像推/弹出导航一样起作用的方法。

如何使用routerLinks模拟类似NavigationForward和NavigationBackward的事件？

我是Angular的新手，正在寻找席卡上的分页。我看到的示例仅对表进行分页。

我有数百个代码，希望将其限制为每页8-10张卡片。如何做到这一点？这是我的html和ts代码。

.html文件

<div  class="flip-right" [ngClass]="mobileQuery.matches ? 'card-wrapper-mobile' : 'card-wrapper'" *ngFor="let items of datasource">
   <div class="card">
      <div class="front">
          <mat-card [ngClass]="mobileQuery.matches ? 'mobile-card' : 'desktop-card'">
                    <a routerLink="/viewPage">
                      <mat-card-header class="header">
                          <mat-card-title>{{items.name}} <mat-icon class="verified title" [inline]="true" >lock</mat-icon></mat-card-title>
                        </mat-card-header>
                            <mat-card-subtitle class="first-subtitle">Last updated on:{{items.Last_updated_on}}</mat-card-subtitle>
                            <mat-card-subtitle>Last updated by:{{items.Last_updated_by}}</mat-card-subtitle>
                        <mat-card-subtitle>{{items.created_by}}</mat-card-subtitle>

                    </a>
            </mat-card>
  </div>
  <div class="back">
      <mat-card [ngClass]="mobileQuery.matches ? 'mobile-card' : 'desktop-card'">
                <a routerLink="/viewPage">
                  <mat-card-header>
                      <mat-card-title>{{items.name}}<mat-icon class="verified" [inline]="true" >lock</mat-icon></mat-card-title>
                    </mat-card-header>

                </a>
        </mat-card>
      </div>
     </div>
    </div>

.ts文件

  import { Component, OnInit,ViewChild } from '@angular/core';
  import { Subscription } from …

我尝试通过运行以下命令将7号角降级为6npm号角：

npm uninstall -g angular-cli
npm cache clean
npm install -g angular-cli@6.1.1

但是，我的文件中仍显示angular/cli 7版本package.json。我需要帮助以降级angular7为angular6。