小编The*_*ram的帖子

当我尝试使用 npm 安装 Angular-cli 时，代码 ETIMEDOUT 出现错误

我尝试删除代理（代理和 HTTP 代理），尝试在管理员模式下运行 cmd，将路径更改为 nodejs 目标

npm ERR! code ETIMEDOUT
npm ERR! errno ETIMEDOUT
npm ERR! network request to https://registry.npmjs.org/@angular%2fcli failed, reason: connect ETIMEDOUT 104.16.22.35:443
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' …

我曾经有一个没有任何验证的简单表单，其中的 HTML 大致如下所示：

<mat-form-field>
        <input matInput
               type="text"
               placeholder="TaskName"
               [(ngModel)]="todoListService.toDoData.taskName"
               formControlName="taskName"
               required
               required>
               [(ngModel)]="todoListService.toDoData.taskName"
        >
    </mat-form-field>

然后我将我的表单移动到响应式表单并收到警告，我不能在与 formControlname 相同的字段上使用 ngModel。正在努力如何将表单中的数据分配到服务的输入字段。

HTMl 的当前部分：

<form [formGroup]="todoForm">
    <mat-form-field>
        <input matInput
               placeholder="TaskName"
               formControlName="taskName"
               required
               [(ngModel)]="todoListService.toDoData.taskName"
        >
    </mat-form-field>

所以我删除了 ngModel 行并将其添加到我的 TS 中：

saveToDo() {
        this.dialogRef.close();
        this.todoListService.toDoData.taskName = this.todoForm.get('taskName');
        this.todoListService.toDoData.dueDate = this.todoForm.get('dueDate');
        this.todoListService.toDoData.extraNote = this.todoForm.get('extraNote');
        this.todoListService.addToDo();
    }

我从中得到的错误是：

ERROR in src/app/new-to-do-dialog/new-to-do-dialog.component.ts(31,9): error TS2322: Type 'AbstractControl' is not assignable to type 'string'.
src/app/new-to-do-dialog/new-to-do-dialog.component.ts(32,9): error TS2322: Type 'AbstractControl' is not assignable to type 'DateConstructor'.
  Property 'prototype' is missing …

我有来自后端的大量项目列表。ion-infinite-scroll一旦用户到达列表末尾，我就会使用 ionic来延迟加载数据。但是当用户到达列表末尾时出现以下错误。

这是我的代码

列表.component.html

<ion-content padding>
    <ion-list>
        <ion-item *ngFor="let i of items">{{i}}</ion-item>
    </ion-list>
    <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
        <ion-infinite-scroll-content loadingSpinner="bubbles"></ion-infinite-scroll-content>
    </ion-infinite-scroll>
</ion-content>

列表.component.ts

export class ActionSheetComponent {

  items = [];
  constructor(
    private actionSheetCtrl: ActionSheetController
  ) {
     for (let i = 0; i < 30; i++) {
      this.items.push(this.items.length);
    }
  }

  doInfinite(infiniteScroll) {
    console.log('Begin async operation');

    setTimeout(() => {
      for (let i = 0; i < 30; i++) {
        this.items.push(this.items.length);
      }

      console.log('Async operation has ended');
      infiniteScroll.complete();
    }, 500);
  }


}

我在角度材料本身中尝试了 xPosition 和 yPostion 。但它不起作用。我不知道我是否错过了什么。

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu" xPosition="after">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>

我提到了几个链接，表明问题已解决。参考这里。

我想不通。

提前致谢。

我正在使用ng-multiselect-dropdown。如何覆盖 CSS？

组件.html

<ng-multiselect-dropdown [placeholder]="'Select Region'" 
    [data]="dropdownList" [(ngModel)]="selectedItems" 
    [settings]="dropdownSettings" (onSelect)="onItemSelect($event)" 
    (onSelectAll)="onSelectAll($event)" > 
</ng-multiselect-dropdown>

组件.css

    .multiselect-dropdown[_ngcontent-c5] .dropdown-btn[_ngcontent-c5] {
        display: inline-block;
        border: 1px solid #adadad;
        width: 100%;
        padding: 6px 12px;
        margin-bottom: 0;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.1;
        text-align: left;
        vertical-align: middle;
        cursor: pointer;
        background-image: none;
        border-radius: 4px;
   }

我需要用上面的 CSS 代码覆盖默认的 CSS

我正在使用最新的 MEAN Stack 技术创建一个博客。登录用户可以创建一个具有“管理员”和“主持人”角色的新用户。

创建具有管理员角色或主持人角色的新用户

该路由受到保护，目前只有登录用户才能访问它。这是用于检查用户是否经过身份验证的中间件。

//check_auth.js

const jwt = require('jsonwebtoken');

module.exports = (req, res, next) => {
  try {
    const token = req.headers.authorization.split(' ')[1];
    jwt.verify(token,  'my_jwt_secret');
    next();
  } catch (error) {
    res.status(401).json({ message: 'Auth failed!'});
  }


};

我应用这个中间件来保护对我的某些路由的未经授权的访问。我想创建一个类似的中间件，在其中检查用户是否是管理员。所以我可以在创建用户的路由上应用这个中间件，这样只有授权用户和具有“admin”角色的用户才能创建新用户。

我认为这有助于创建中间件。当用户登录时，id、电子邮件和角色存储在 jwt 中。

router.post("/login", (req, res, next) => {
  let fetchedUser;
  User.findOne({ email: req.body.email })
    .then(user => {
      if (!user) {
        return res.status(401).json({
          message: "Auth failed"
        });
      }
      fetchedUser = user;
      return bcrypt.compare(req.body.password, user.password);
    })
    .then(result => {
      if (!result) { …

我在应用程序中定义一个管道示例，它将大写字符串转换为小写字符串，例如：'Activities' => 'activities '。数据采用数组格式，我将此过滤器应用于*ngFor. 它返回一个错误，提示“toLowerString不是函数”，请帮助我理解哪里出错了。

演示链接

我有一个刷新图标，用于刷新或重新加载网格。但是使用以下代码

<i class="fas fa-sync fa-fw" (click)=refresh()></i>

图标不动。我找到了以下旋转图标，但我只能找到有关如何减慢或加快旋转动画速度的文档。

<i class="fas fa-sync fa-spin" (click)=refresh()></i>

我用谷歌搜索，发现只有npmjs一个可控的旋转图标，但不是我喜欢的。

我在想ngIf或ngClass。在它调用刷新功能重新加载数据的单击事件，是有办法的两个类之间切换fa-fw和fa-spin。基本上，单击按钮时图标会旋转并在重新加载完成后停止？

对新手的任何帮助表示赞赏。谢谢。

我是Angular的新手，正面临这个问题。

我想检查变量的值elementRef是否在显示数据之前为空，因为我想显示图表。这是我的代码：

component.ts

@ViewChild('normalDeviasiDaily', {read: ElementRef}) normalDeviasiDaily: ElementRef;

component.html

  <div *ngIf="normalDeviasiDaily">
    <div #normalDeviasiDaily id="normalDeviasiDaily">
      <canvas style="width:100%; height:400px;"></canvas>
    </div>
  </div>
  <div *ngIf="!normalDeviasiDaily">
    <skeleton-item height="400px"></skeleton-item>
  </div>

我的问题是cannot read property nativeElement of undefined，有没有其他人遇到过，请帮助我。

谢谢。

getDefaultMiddleware更新后我收到一个已弃用的警告"@reduxjs/toolkit": "^1.6.1"那么我应该如何删除这个警告。我们还有其他方法可以在configureStore函数中注入默认中间件吗？

import { configureStore, getDefaultMiddleware } from "@reduxjs/toolkit";
import reducer from "./reducer";
import api from "./middleware/api";
export default function storeConfigure() {
   const store = configureStore({
   reducer,
   middleware: [
      ...getDefaultMiddleware(), 
      api
    ],
  });
  return store;
}

任何帮助表示赞赏谢谢！