标签: angular8

我应该如何解决以下错误消息：

无法编译 /.../SoftwareLicenseCodes/index.tsx (14,20)：“any”的类型声明失去类型安全性。考虑用更精确的类型替换它。此错误发生在构建期间，无法消除。

请看下面的代码：

import * as React from 'react';
import './SoftwareLicenseCodes.css';

interface SoftwareLicenseCodesProps {
}

interface SoftwareLicenseCodesState {
    count: string;
    oneTimeUsage: boolean;
    duration: string;
    validFrom: string;
    validTo: string;
    distributor: string;
    [key: string]: any;
}

class SoftwareLicenseCodes extends React.Component<SoftwareLicenseCodesProps, SoftwareLicenseCodesState> {
    constructor(props: SoftwareLicenseCodesProps) {
        super(props);

        this.state = {
            distributor: '',
            count:'',
            oneTimeUsage: false,
            duration: '',
            validFrom: '',
            validTo: ''
        };

        this.onInputChange = this.onInputChange.bind(this);
    }

    handleSubmit(event: React.FormEvent<HTMLFormElement>) {
        alert('submit');
        event.preventDefault();
    }

    onInputChange = (event: React.FormEvent<HTMLInputElement>) => {
        const value = …

迁移到@ng-select v3.x ( https://github.com/ng-select/ng-select ) 后，鼠标单击不再适用于项目。我的应用程序使用 bootstrap 4 和 Angular 8。返回到 v2.20.5 版本再次正常工作。

有人有同样的问题吗？

这是我的 ts 文件：

this.store.pipe(select(subscribe.getRegCategories)).pipe(takeUntil(this.ngUnsubscribe)).subscribe(data => {
            if (data && data.length) {
                this.allRegCategories = data;
            }
        });

当我去测试时出现错误：

this.store.pipe(select(subscribe.getRegCategories)).pipe(takeUntil(this.ngUnsubscribe)).subscribe(data => {

TypeError: Cannot read property 'pipe' of undefined

这里如何提供管道？解决这个问题的正确方法是什么？

这是我的测试规范文件：

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Store, select } from '@ngrx/store';
import { RouterTestingModule } from '@angular/router/testing';
import { HttpClientModule } from '@angular/common/http';
import { ShellViewProgMgmtComponent } from './shell-view-prog-mgmt.component';
import { ViewProgMgmtComponent } from './../../components/view-prog-mgmt/view-prog-mgmt.component';
import * as actions from './../../state/actions/setup-config.actions';

describe('ShellViewProgMgmtComponent', () => {
    let component: …

我有一个菜单项列表，我想将数组中的最后一项设为链接。

现在，菜单项是从组件构建的，但我不确定如何使数组中的最后一项成为链接。

ActionMenuItem.component.html

  <div *ngIf="expanded">
  <actionmenuitem *ngFor="let child of line.children" [line]="child" (inWorkspace)="toWorkspace($event)"></actionmenuitem>

ActionMenuItem.Component.ts

  onSelect(){
// If it has children, expand them && flip carat.
if(this.line.children.length > 0){

  this.expanded = !this.expanded;

  if(this.iconName == "expand_more"){
    this.iconName = "expand_less"
  } else {
    this.iconName = "expand_more"
  }

} else {
  this.inWorkspace.emit(this.line);
}

我有两种返回可观察值的方法。如果首先返回一些数据则无需调用第二个方法。但如果第一个方法返回 null，则仅调用第二个方法。

getdefaultAddress(id) : Observable<Address[]> { 
    return this.http.get<Address[]>(this.url + 'users/' + id + '/addresses' + '?filter[where][default]=true')
  }

getFirstAddress(id): Observable<any>{
    return this.http.get<any>(this.url + 'users/' + id +'/addresses?filter[limit]=1'  )
  }

在使用 if-else 订阅第一个可观察值后，我可以轻松地做到这一点。喜欢

this.getdefaultAddress(id).subscibe(data =>{
    if(data) {
      // do something
    }

    else {
      this.getFirstAddress(id).subscibe(data =>{
        // do something
      })
    }
  })

现在我如何在不真正订阅第一个可观察对象的情况下检查这一点？有 rxjs 运算符吗？

先感谢您

我运行 ng build --configuration=production 构建了我的应用程序并将其上传（通过 FTP 手动）到服务器（我尝试了两个不同的）。访问像 myurl.com 这样的根目录工作正常，但每当我想直接访问子页面（例如 myurl.com/subpage）时，页面都是空白的，并且出现以下错误：\nLoading module from \xe2\x80\x9chttps://myurl.com/runtime-es2015.js\xe2\x80\x9d was blocked because of a disallowed MIME type (\xe2\x80\x9ctext/html\xe2\x80\x9d).对于 polyfills-es2015 也出现同样的错误。 js, main-es2015.js

如果我访问根目录并导航到子页面，一切正常。

直到现在我尝试：

\n

• <base href=".">在index.html中设置

\n

• "target": "es5"在 tsconfig.json 中设置

\n

• 手动将脚本类型从 更改type="module"为type="text/javascript"\n，如下所示：<script src="runtime-es2015.js" type="text/javascript">

\n

Angular CLI 和 Angular 版本8.1

打字稿版本3.4.5

网页包版本4.35.2

在服务器上，我还有一个需要的 .htaccess 文件，否则访问 myurl.com/subpage 会导致 404

<IfModule mod_rewrite.c>\nRewriteEngine On\nRewriteBase /\nRewriteRule ^index\\.html$ …

我正在尝试将 Quill 文本编辑器添加到我的 Angular 8 项目中，但它无法在浏览器上正确呈现。

控制台中没有出现任何错误，这是浏览器中显示的内容：

我按照此处概述的安装步骤进行操作。

另外，我的 angular.json 中提到了以下内容：

"styles": [
    "src/styles.css",
    "./node_modules/quill/dist/quill.core.css",
    "./node_modules/quill/dist/quill.snow.css"
    ],
"scripts": ["./node_modules/quill/dist/quill.js"]

以下是我的 NgModule 中的导入：

imports: [
    BrowserModule,
    AppRoutingModule,
    QuillModule.forRoot()
],

这是我的 HTML：

<div id="quill">
    <p>Content *</p>
    <quill-editor [styles]="editorStyle" placeholder="Enter Text" [modules]="config" formControlName="yourCtrlname"
required>
    </quill-editor>
</div>

有人可以告诉我为什么编辑器无法正确渲染>

我正在使用 leafletjs 作为我的应用程序的地图功能。安装好了，写了一些简单的代码，看一张图。虽然图块没有正确渲染

即使我拖到另一个地方，它仍然缺少一块块瓷砖。这是我的代码

超文本标记语言

<div #map style="width:100%; height:100%;"
leaflet
(leafletMapReady)="onMapReady($event)"
[leafletOptions]="options">
</div>

TS

import { Component, OnInit } from '@angular/core';
import { latLng, MapOptions, tileLayer } from 'leaflet';

@Component({
  selector: 'app-map',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.scss']
})
export class MapComponent implements OnInit {

  options: MapOptions;

  constructor() { }

  ngOnInit(): void {
    this.options = {
      layers: [
        tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: '...', minZoom: 5 })
      ],
      zoom: 5,
      center: latLng(46.879966, -121.726909)
    };
  }

  onMapReady(map) {
    console.log("SHITS HERE DUMBAASS");
    setTimeout(() => …

我只想在表单输入更改时启用表单中的提交按钮。

在提交时，窗体控件值不改变按钮应被禁用。

我尝试使用FormGroup.pristine标志来启用/禁用提交按钮。

它适用于启用按钮。

但是，true当 UI 中的值更改回其原始值时，它不会重置。

组件代码：

import { Component } from '@angular/core';
import { FormBuilder } from '@angular/forms';

@Component({
  selector: 'app-registration-form',
  templateUrl: './registration-form.component.html',
  styleUrls: ['./registration-form.component.scss']
})
export class RegistrationFormComponent {
  public registrationForm;
  public formValues = {
      gender: 1,
    };

  constructor(private formBuilder: FormBuilder) {
    this.registrationForm = formBuilder.group(this.formValues);
  }

  onSubmit(formData) {
    console.log('Your form is submitted', formData);
    this.registrationForm.reset(this.formValues);
  }
}

<form class="registration-form" [formGroup]="registrationForm" (ngSubmit)="onSubmit(registrationForm.value)">
  <div>
    <label for="gender">Gender</label>
    <select id="gender" formControlName="gender">
      <option …

因为它在构建过程中显示错误。

app/pages/TestPage4/TestPage4.ts:27:27 中的错误 - 错误 TS2304：找不到名称“google”。

27 this.geoCoder = 新的 google.maps.Geocoder; ~~~~~~ app/pages/TestPage4/TestPage4.ts:29:32 - 错误 TS2304：找不到名称“google”。

29 const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement); ~~~~~~ app/pages/TestPage4/TestPage4.ts:33:24 - 错误 TS2503：找不到命名空间“google”。

33 常量位置：google.maps.places.PlaceResult = autocomplete.getPlace(); ~~~~~~

下面是我的代码。

import { Component, OnInit, ElementRef, ViewChild, NgZone } from '@angular/core';
import { MapsAPILoader } from '@agm/core';

@Component({
  selector: 'app',
  templateUrl: './TestPage4.html',
  styleUrls: ['./TestPage4.css']
})

export class TestPage4 implements OnInit {
  lat: number;
  lng: number;
  zoom = 1;
  private geoCoder;

  @ViewChild('search', { static: false})
  public searchElementRef: ElementRef;

  constructor( …