标签: angular5

我在配料.model.ts 中声明了一个模型

export class Ingredient {
 constructor(private name: string, public amount: number) {}

 getName() { return this.name }
}

在配料.service.ts 中，如果我以这种方式获取它们：

httpClient.get<Ingredient>(url).subscribe(
 (igredient) => {
   console.log(igredient.getName());
 });

它在控制台中给出错误，例如“属性 igrient 中没有方法 getName”。

另外，每当我尝试声明属性类型 Category[] 时，它都会失败，但 Array 似乎工作正常。

编辑： 我想提供更多信息。

给定 Igredient 模型和以下 JSON 结构：

{
 name: "Apple",
 amount: "5",
 created_at: "date",
}

Igredient 构造函数甚至没有被调用，因此 GET 有效负载不会被解析。

我在运行项目时遇到错误。

这是代码：

private populateModels() {
    var selectedMake = this.makes.find(m => m.id == this.vehicle.makeId);
    this.models = selectedMake ? selectedMake.models : [];
}

这是错误：

ERROR in [at-loader] ./ClientApp/app/components/vehicle-form/vehicle-form.component.ts:82:40
          TS7006: Parameter 'm' implicitly has an 'any' type.

在项目的根src目录assets中有放置图像的目录。

在用户服务中，我阅读了这些图像，例如：

return (data.photo == undefined || data.photo == null) ? '../../../assets/img/blank-person.jpg' :

你可以看到相关的路径，这是不好的方法。如何指定资产的绝对路径？

假设有一个组件ButtonComponent 和SideComponent。如何将“ButtonComponent”作为属性传递给“SideComponent”？

例如，

@Component({
  selector: 'my-btn',
  template: '<span>My button</span>'
})
export class ButtonComponent implements OnInit {

} 


@Component({
  selector: 'my-side',
  template: '<div><div class="btn-section">{{myBtn}}</div><div class="content-section"><ng-content></ng-content></div></div>'
})
export class SideComponent implements OnInit {
   @Input() myBtn:any = null;
}

Usage:
<my-side [myBtn]="btnTmpl">
  Hello, this is my content
</my-side>
<my-btn #btnTmpl></my-btn> 

但这不起作用，最终模板显示 [Object Object] 作为输出。

我正在使用primeng p-calender 我要求不要将过去的日期发送到API，

所以我想禁用过去的日期选择

如果有人知道请评论

提前致谢

我是 Angular 5 的新手，在这里我面临着组件路由的问题。

我想要做的是，当用户首先打开应用程序时，它应该显示一个登录屏幕（登录屏幕具有浏览器窗口的全高和全宽）。一旦用户成功验证，用户就会进入Home 组件。

这里 Home 组件有 Toolbar 和 Side menu bar ，如果用户从侧边菜单栏中选择了任何一个，我想在 home 组件的内容区域中显示相关（组件）数据。

截至目前一切正常，我的意思是当用户打开应用程序登录屏幕时首先显示并成功验证主页显示给用户。

当用户从侧边菜单栏中选择任何菜单时会出现问题，该组件未显示在 Home 组件的内容区域中，它作为单独的组件打开并全屏显示。

home.component.ts

 <mat-sidenav-container class="sidenav-container">

      <mat-sidenav #drawer class="sidenav" fixedInViewport="true" [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
        [mode]="(isHandset$ | async) ? 'over' : 'side'" [opened]="!(isHandset$ | async)" style="background:black">
        <mat-toolbar class="menuBar">Menus</mat-toolbar>
        <mat-nav-list>
          <a class="menuTextColor" mat-list-item routerLink="/settings">Link 1</a>
        </mat-nav-list>
      </mat-sidenav>

      <mat-sidenav-content>
        <mat-toolbar class="toolbar">
          <button class="menuTextColor" type="button" aria-label="Toggle sidenav" mat-icon-button (click)="drawer.toggle()"
            *ngIf="isHandset$ | async">
            <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
          </button>
          <span …

我在 Angular 5 中使用了带有 HttpInterceptor 的拦截器，并且我在使用 rxjs 时遇到了问题，其中我的所有 http 请求都重复了。

import { Router } from '@angular/router';
import { Injectable, ApplicationRef } from '@angular/core';
import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/empty';
import { NgxSpinnerService } from 'ngx-spinner';
import { ErrorHandlingService } from '../../service/error-handling.service';

@Injectable()
export class ApiRequestInterceptor implements HttpInterceptor {

  private count: number = 0;

  constructor(
    private readonly spinner: NgxSpinnerService,
    private readonly router: Router,
    private readonly …

我一直在寻找方法，但找不到出路。我有 4-5 个 json 文件，它们具有相同的结构和不同的值。基于存储在 localStorage 中的值，我想加载适当的 json。目前，我在顶部加载一个文件：

import * as data_json from "../app_data_files/file.json";

我试着做。例如，基于此条件，导入文件 1

if ( 1 ==1){
    import * as data_json from "../app_data_files/file1.json";
 }

但是打字稿抱怨导入语句只能在模块或命名空间中发生。

localstarge 中的值与要加载的文件相匹配，因此我无法真正预测。我检查的只是是否有价值。如果不是，则将使用加载的默认顶部。希望这是有道理的。

我怎样才能做到这一点？

有没有更简单的方法来做,或者我需要从头开始.

在Angular 5中,我想根据我从PHP后端(数组)收到的输出显示不同的文本.比如说,每条记录都有一个状态字段.状态可以是"已提交","已取消","请求成本"等.我想在状态中显示状态(在Angular 5中),就好像状态是'requestforcost'一样,它将打印为"Request for成本.如果状态为"已取消",则会打印为"已取消"等.我应该使用"NgIf,Else,Then"吗？目前我编写的代码如下:

<td class="font-size-md">{{item.status}}</td>