小编mx_*_*ode的帖子

以下是我的角度应用程序结构

app.module.ts
 -- StoreModule.forRoot()
    mainboard.module.ts
        --StoreModule.forFeature('mainboard', reducer)

            subFeature1.module.ts
            subFeature2.module.ts
            subFeature3.module.ts

    dashboard1.module.ts
        --StoreModule.forFeature('dashboard1', reducer)

            subFeature1.module.ts
            subFeature2.module.ts
            subFeature3.module.ts
            subFeature4.module.ts
            subFeature5.module.ts

    dashboard2.module.ts
        --StoreModule.forFeature('dashboard2', reducer)

            subFeature1.module.ts
            subFeature2.module.ts

    dashboard3.module.ts
        --StoreModule.forFeature('dashboard3', reducer)

            subFeature1.module.ts
            subFeature2.module.ts
            subFeature3.module.ts
            subFeature4.module.ts

    dashboard4.module.ts
        --StoreModule.forFeature('dashboard4', reducer)

            subFeature1.module.ts
            subFeature2.module.ts

所以要求是存储子功能。

像这样：

app.module.ts
 -- StoreModule.forRoot()
    mainboard.module.ts
        --StoreModule.forFeature('mainboard', reducer)

            subFeature1.module.ts
              --StoreModule.forFeature('subFeature1', reducer)

            subFeature2.module.ts
              --StoreModule.forFeature('subFeature1', reducer)
            subFeature3.module.ts
              --StoreModule.forFeature('subFeature1', reducer)


...

我如何才能为我的 NGRX/商店实现这样的层次结构？

app.module 是放置所有仪表板的地方。

dashboard-x.modules 是放置所有导航/项目的地方。

并在每个仪表板中包含子功能。

所以我的问题是关于如何使用 StoreModule.forFeature() 注册 subFeatures？

或者我是否需要为每个仪表板创建商店 (StoreModule.forRoot())，然后为每个子功能创建 StoreModule.forFeature()？（如果是这样，那么我如何才能在应用程序的 StoreModule.forRoot() 中注册它）

笔记

目前我正在将所有子功能注册为 forFeature.('subfeturename', reducer)

但问题在于，当我查看我的状态树（Redux devtools）时，它没有遵循上述存储树结构。由于所有子功能都注册为 forFeature()，因此所有子功能都显示为属性（即，它们没有按预期嵌套）。我想要的是我想让它们嵌套在我的状态树中。

所以如果我看看我的状态树，我可以看到嵌套状态像这样：

app
    mainboard(open)
          subFeature1 …

我们能够为复选框、文本输入等本机输入元素设置值（如果需要）。

它将是这样的：

<input type="text" [value]="customValue">

通过这种方式，我们可以将自定义值绑定到本机输入元素。

如何使用使用控制值访问器实现的自定义输入元素获得类似的结果？

例如，考虑这个自定义输入组件：

@Component({
  selector: 'child-custom-input',
  templateUrl: './child-custom-input.component.html',
  styleUrls: [],
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => ChildCustomInputComponent),
      multi: true,
    },
  ],
})
export class ChildCustomInputComponent implements ControlValueAccessor {
  _value: boolean;

  onChanged: any = () => {};
  onTouched: any = () => {};

  constructor() {}

  writeValue(value: any) {
    this._value = value;
  }

  registerOnChange(fn: any): void {
    this.onChanged = fn;
  }

  registerOnTouched(fn: any): void {
    this.onTouched = fn;
  }

  setValue(value) {
    this._value = value;
    this.onChanged(value); …

如何将驼峰式字符串转换为不排除任何特殊字符的句子大小写？

建议使用正则表达式将带有特殊字符和数字的驼峰式字符串转换为句子大小写？：

const string = `includes:SummaryFromDetailHistory1990-AsAbstract`

预期结果：

Includes : Summary From Detail History 1990 - As Abstract

目前我正在使用 lodash startCase 将camelCased 转换为sentenceCase。但这种方法的问题在于它正在删除特殊字符，如括号、数字、括号、连字符、冒号等......（大多数特殊字符）

所以这个想法是将驼峰字符串转换为句子大小写，同时保留字符串身份

例如：

const anotherString = `thisIsA100CharactersLong:SampleStringContaining-SpecialChar(s)10&20*`

const expectedReturn = `This Is A 100 Characters : Long Sample String Containing - Special Char(s) 10 & 20 *`

用正则表达式可以吗？

如何防止 vue axios 出现 CORS 问题？

以下是使用 vue 和 axios 向后端发出请求的代码。

axios.config.js

/// here I'm creating a vue axios instance.

import axios from "axios";

export default axios.create({
  baseURL: "https://example.com/api/v1/",
  headers: {
    Accept: "application/json",
    Authorization: "TOKEN 3413413dfdsfsafd3rr41",
  },

});

和里面 vue.config.js

我已经代理了请求。

module.exports = {
  devServer: {
    proxy: {
      "/api/*": {
        target: "http://localhost:8081",
        secure: false,
        changeOrigin: true,
      },
    },
  },
};

在我的 vuex 商店中，我正在调用一个操作：

import axios from 'axios.config'

  actions: {
    getData({ commit }) {
      axios
        .get(`products/grocery`)
        .then((res) => {
          console.log("res :", …

如何使用 new 关键字实例化角度分量？

想象一下以下作为无模板组件：

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

@Component({
  selector: 'my-component',
})
export class MyComponent {
constructor(private myService: MyService)
}

我知道角度组件仅在模板中找到选择器标签时才会实例化。

但是...我如何使用 new 关键字实例化上面的内容？因为我的组件不需要模板。

但它应该是一个带有@component装饰器的角度组件。（因为我需要依赖注入的功能）

但问题是，当我创建一个如下所示的新组件时：

const comp = new MyComponent()

它还要求在实例化时将服务实例传递给其构造函数。像这样”

const comp = new MyComponent(new MyService())

当我们再次传入的服务依赖于其他服务时，事情会变得更加困难。

像这样...

const comp = new MyComponent(new MyService(new AnotherService(new YetAnotherService(... so on))))

那么有解决方法吗？

Angular 的 DI 很好。因为我们没有像上面这样的问题。它会自动创建所有注入的服务。那么用new关键字可以吗？

注意我尝试使用普通的打字稿类。但我还是不喜欢它。我想使用角度组件本身。

那可能吗？

如何使用 JavaScript 在 mapbox 中监听不同的点击事件？以下是使用地图框显示地图的代码。

有人可以建议如何收听区分土地和水体的点击事件吗？

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Display a map on a webpage</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<link href="https://api.mapbox.com/mapbox-gl-js/v2.2.0/mapbox-gl.css" rel="stylesheet">
<script src="https://api.mapbox.com/mapbox-gl-js/v2.2.0/mapbox-gl.js"></script>
<style>
body { margin: 0; padding: 0; }
#map { position: absolute; top: 0; bottom: 0; width: 100%; }
</style>
</head>
<body>
<div id="map"></div>
<script>
    mapboxgl.accessToken = 'pk.eyJ1IjoiZGphZWJvIiwiYSI6ImNrbzJoYjhodTAxeDUyb211eTF2anZ0bmQifQ.62m9LNQhEPZNCwqxEW9pPQ';
var map = new mapboxgl.Map({
container: 'map', // container id
style: 'mapbox://styles/mapbox/streets-v11', // style URL
center: [-74.5, 40], // starting position [lng, lat]
zoom: 9 // …

如何在自身内部引用对象？

正如你在下面看到的，我在 console.log 中创建了一个未命名的对象

    console.log({
      x: 2,
      y: this.x * 2,
    });

我没有将它分配给任何变量。

所以我想要一种方法来访问它x本身内部的属性，比如调用this.x.

但是，上述方法不起作用。

我收到一个NAN错误。

注意我不希望它使用函数构造函数/原型分配给变量/创建。