标签: angular8

<mat-slide-toggle>Slide Me!</mat-slide-toggle>

如何增加切换拇指图标的长度，是否可以将切换拇指图标自定义到栏的末尾？

问这个问题似乎有点奇怪，但我无法弄清楚。

我已经浏览过 stackoverflow 上的链接和谷歌，事实上尝试了很多东西，但我无法得到解决方案。下面是一些值得一提的

Angular 6 HTTP 客户端发布 - 错误请求

如何强制 Angular2 使用 x-www-form-urlencoded 进行 POST

问题 - api 的请求选项始终为 400（错误请求）

见解 -

下面是在另一个项目上运行的代码

  const headers = new HttpHeaders({
    'Content-Type': 'application/x-www-form-urlencoded'
  });
  const body = new HttpParams()
    .set('grant_type', 'password')
    .set('username', stateData.username)
    .set('password', stateData.password)
    .set('client_id', 'XXXXX-5B3C-4A7D-WEW-23BWWWF9B7872'); //Letters are dummy here for security reasons

//URL preceded by https
return this.http.post('abc.com/authtoken', body , {headers: headers }).pipe(
  map(res => {
    return res;
  })
 );

现在，当我在另一个项目中尝试相同的代码时，它不会传递 OPTIONS 请求，抛出 400（错误请求）。

我们可以假设其余的事情都是为了使这项工作顺利进行。问题主要出在代码片段上。

最令人惊奇的是，当我在 url 中添加一个尾部斜杠（如 - authtoken/ …

我正在NgRx我的新 Angular 8 项目中使用该库。我被告知他们使用createActionie创建操作NgRx 8，但他们使用NgRx 7. 我接到了一项任务，其中我使用了NgRx 8我的减速器，现在我必须将其更改为NgRx 7。我的动作和减速器如下：

书本.actions.ts

import { createAction, props } from "@ngrx/store";
import { Book } from "./book";

export const BeginGetBooksAction = createAction("BeginGetBooks");

export const SuccessGetBooksAction = createAction(
  "SuccessGetBooks",
  props<{ payload: Book[] }>()
);

export const BeginAddBookAction = createAction(
  "BeginAddBook",
  props<{ payload: Book }>()
);

export const SuccessAddBookAction = createAction(
  "SuccessAddBook",
  props<{ payload: Book[] }>()
);

书本.reducer.ts

import { Action, createReducer, on } …

尝试获取元素引用名称但不起作用。如果有人知道请帮助找到解决方案。

Alert 应该像容器一样。因为那是元素引用。

应用程序组件.html：

<div (click)="test(event)" #container></div>

应用程序组件.ts：

test(e){
   alert(e.elementRef);
   //Output should be like alert("container");
}

我正在尝试创建此仪表板，我想知道如何在单击菜单链接时更改一个组件？

我把它分成 3 个部分

<div id="wrapper">
  <app-dashboard-menu></app-dashboard-menu>
  <div id="content-wrapper" class="d-flex flex-column">
    <div id="content">
      <app-dashboard-topbar></app-dashboard-topbar>
      <app-dashboard-content></app-dashboard-content>
    </div>
  </div>
</div>

我想知道如何添加（onclick）到菜单项并将其更改为让我们说并保持相同的布局。只是为了能够仅将仪表板内容更改为我创建的任何其他组件

我有一个返回类型文档的 api 调用：content-type
image/png

图像被发回，但没有 url，它只是发回整个图像对象。如果直接在浏览器上调用 api，它只会直接显示图像。

我希望能够有一个服务来获取此图像并将其显示在组件中。

图像数据.ts

import { Observable } from 'rxjs';

export interface ImageInfo {
    image: Image
}

export abstract class ImageData {
  abstract getImageData(): Observable<ImageInfo>;
}

图像数据服务.ts

import { Injectable } from '@angular/core';
import { of as observableOf, Observable } from 'rxjs';
import { ImageInfo, ImageData } from '../data/image-data';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { throwError } from 'rxjs';
import { retry, catchError } from 'rxjs/operators';

@Injectable()
export class ImageDataService extends ImageData …

我试图将十进制形式的数字值转换为整数。

使用角管方法，{{myNumber | number: '1.0-0.}}它返回四舍五入的数字。

示例：因为number = 3.8它正在返回4，但我想要下限值3。

如何获得角度 8 中任意数字的下限值？

我有一个带有tinymce编辑器的Angular 8项目。它在本地工作，但在某些时候工具栏图标在使用 CI/CD 管道部署的生产中消失了。

我得到 404 /tinymce/icons/default/icons.min.js。

icon.min.js 到底是什么？

我的 angular.json 资产如下所示：

{
                "glob": "**/*",
                "input": "node_modules/tinymce/skins",
                "output": "/tinymce/skins/"
              },
              {
                "glob": "**/*",
                "input": "node_modules/tinymce/themes",
                "output": "/tinymce/themes/"
              },
              {
                "glob": "**/*",
                "input": "node_modules/tinymce/plugins",
                "output": "/tinymce/plugins/"
              }

在 Angular 8 中执行此操作的最佳方法是什么

我有两个输入，分别是 fromDateMin 和 fromDateMAx 的日期，我需要将这两个输入与 formControlName='fromctrlname' 和 formControlName='toctrlname' 进行比较并显示错误

状况：

如果 fromDateMin 不为空，则用户无法选择早于该日期的日期。如果这样做，日期将更改为该日期。在错误消息范围内显示消息。

如果 fromDateMax 不为空，则用户无法选择晚于该日期的日期。如果这样做，日期将更改为该日期。在错误消息范围内显示消息。

fromDate 必须早于或等于 toDate。toDate 必须晚于或等于 fromDate。在错误消息范围内显示消息。

这是我到目前为止所尝试过的

https://stackblitz.com/edit/angular-2gdadn?file=src%2Fapp%2Fapp.component.ts

这是我的html

    <form [formGroup]='dateFilterForm'>
      <label *ngIf="fromLabel != ''" for="{{componentId}}-fromDate">{{fromLabel}}</label>
      <input type="date" formControlName='fromctrlname' id="{{componentId}}-fromDate" name="{{componentId}}-fromDate"
        placeholder="{{fromPlaceholder}}" [(ngModel)]="fromDate" (ngModelChange)="errMsg = ''" [value]="fromDate">
    
      <label *ngIf="toLabel != ''" for="{{componentId}}-toDate">{{toLabel}}</label>
      <input type="date" formControlName='toctrlname' id="{{componentId}}-toDate" name="{{componentId}}-fromDate"
        placeholder="{{toPlaceholder}}" [(ngModel)]="toDate" (ngModelChange)="errMsg = ''" [value]="toDate">
    
      <button type="submit" (click)="submit()"
        class="btn button-border white icon-rightarrow-white medium mt2 ml2 mr1 mb2 r15 fw7"
        style="display:inline-block;">{{buttonLabel}}</button>
    
      <div class="error-message mb3 …

鉴于：

<video poster="assets/videos/poster.png"
       #videoPlayer 
       onloadedmetadata="this.muted = true">
     <source src="assets/videos/video.mp4" type="video/mp4">
</video>

在角度中：

...

public videoLoaded: boolean = false;

...

如何绑定 videoLoaded 以在视频开始播放后进行更新？（或已加载）我在网上查看并看到一些较旧的 jquery 实现似乎无法在较新版本的 chrome 中工作，并且想知道如何实现此目的的最新方法

谢谢