小编Vel*_*dan的帖子

路由器插座的角度2输出

我想从在路由器插座内部渲染的子组件进行导航.我的父组件有一个路由器配置,我想手动导航一些事件.但是我不知道如何在没有输出的情况下从子节点向父节点传递一些数据(用于导航).因为这种结构不起作用

 <router-outlet (navigateTo)="navigateToMessagePart($event)"></router-outlet>
Run Code Online (Sandbox Code Playgroud)

我怎么能以正确的方式做到这一点?也许从孩子那里导航吧?但我如何从孩子那里得到父方法.非常感谢您的帮助!

binding angular

48
推荐指数
3
解决办法
4万
查看次数

RangeError:超出最大调用堆栈大小Lazy routing Angular 2

我正在尝试将懒惰路由应用到我的应用程序中.

我有一个非常大的项目,当它在路由器已弃用时,我使用了AsyncRoute,但现在它已被删除.

所以我尝试实现最新的延迟加载,但是我遇到了一个问题 RangeError:超出了最大调用堆栈大小 我做错了什么?我在指令中做了所有代码.

请看一下

EncountersModule

    import { NgModule } from '@angular/core';
    // import { CommonModule } from '@angular/common';
    /* ---------------  !System modules  --------------- */

    import { SharedModule } from 'sharedModule';   //There is  a lot of shared components/directives/pipes (over 60) and it re-exports CommonModule so I can't avoid it
    /* ---------------  !App outer modules  --------------- */


    import { EncountersComponent } from './encounters.component';
    // import { PassCodeComponent } from '../../shared/components/passcode/passcode.component';


    @NgModule({
      imports: [ SharedModule ],
      declarations: [ EncountersComponent],
      exports: [ …
Run Code Online (Sandbox Code Playgroud)

typescript angular2-routing angular

41
推荐指数
4
解决办法
4万
查看次数

如何在webpack 2中禁用优化警告

我正在使用React/Webpack 2等我有Karma测试运行器,当我运行我的测试时,我之前启动了Webpack,它会向控制台发出有关大小等的警告输出(我无法解决它,因为它是webpack的东西).

如何禁用这些警告?我试着设定

统计:"无", 但它不起作用.

谢谢你的帮助

WARNING in ./src/modules/Module1/index.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\Module1\index.js
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\module1\index.js
    Used by 1 module(s), i. e.
    C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\routes.js

WARNING in ./src/modules/Module1/containers/Module1.container.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic. …
Run Code Online (Sandbox Code Playgroud)

warnings karma-runner reactjs webpack-2

17
推荐指数
1
解决办法
7111
查看次数

如何配置 Prettier 来格式化 Styled Components 条件渲染

我正在使用 Prettier、Eslint 和 Styled 组件 - 反引号样式声明。到目前为止它可以工作,但是 Prettier 以 Eslint 不允许的方式格式化 Styled 组件的条件渲染,并且在格式化之后 Eslint 开始抱怨并且构建失败。

让我通过代码向您展示问题。

Prettier 处理前的初始代码:

// styled components styles apply
const TextInputStyled = styled(TextInputThemed)`
  ${(props: StyledProps) => {
    const {
      theme: { theme10x },
      disabled,
      success,
      error,
    } = props;
    return `
      ${success && `
        border-color: ${theme10x.palette.common.success};
      `};

      ${error && `
        background-color: ${theme10x.palette.common.error};
      `};

      ${disabled && `
        background-color: ${theme10x.palette.background.disabled};
      `};
    `;
  }}
Run Code Online (Sandbox Code Playgroud)

更漂亮的处理后:

// styled components styles apply
const TextInputStyled = styled(TextInputThemed)`
  ${(props: StyledProps) => {
    const …
Run Code Online (Sandbox Code Playgroud)

formatting reactjs eslint styled-components prettier

13
推荐指数
1
解决办法
7253
查看次数

类组件中的 React.useMemo

有没有办法在类组件的情况下使用这个钩子或它的一些类似 React API 的东西?

我想知道,我应该在类组件的情况下使用一些第三方备忘录助手(例如lodash memomemoizeOne等),还是存在一些用于类组件的官方反应 API 方式。

谢谢你的帮助。

聚苯乙烯

我想在改变孩子的情况下生成 uuid。

使用 SFC 组件我可以像这样使用 useMemo

const keyValue = useMemo(() => uuid()(), [children])
Run Code Online (Sandbox Code Playgroud)

但是如何在没有任何第三方等的情况下为基于类的组件实现相同的效果。
PPS 我没有使用 Redux 等,仅使用纯 React.js

memoization reactjs react-usememo

13
推荐指数
1
解决办法
1万
查看次数

为核心组件Angular 2提供路由器服务

我有ng2应用程序,我有app/app.module ...和core/core.module ....

在核心模块中,我有一些模块在app顶级使用,只有一次(比如在官方文档中),但其中一个模块需要路由器模块(某些功能正在使用路由器).

但路由器是在App.module中提供的(带有所有App路由).我遇到了问题 - 没有来自core/header/header.component的ActivatedRouteSnapshot提供程序

我怎么解决它?我应该将我的标题从核心放到app文件夹,还是应该为核心模块提供路由器?谢谢.

使用路由器模块更新PS.我仍然遇到错误 - 没有RouterStateSnapshot的提供程序!

标准路由器和activatedRoute正在工作的其他有趣的事情.因此,当我 从构造函数中删除RouterStateSnapshot(并删除相对console.log)时,所有代码都正常工作.所以看起来像routerModule是可用的,这真的很奇怪.

import { NgModule, Component, OnInit} from '@angular/core';
import { CommonModule } from '@angular/common';
//import { ROUTER_DIRECTIVES, Router } from '@angular/router-deprecated';
import { Router, ActivatedRoute, Params, RouterStateSnapshot } from '@angular/router';
/* ------- !Angular2 core  ---------*/

import {HTTPPatientsListService} from '%cgm_sharedServices%/http_patients_list.service';
/* ------- !Services  ---------*/

import { Config } from 'appConfig';
/* ------- !Config  ---------*/


@Component({
  selector: 't_breadcrumbs',
  template: `

      <h1>Bread</h1>

        <!--<div class="row wrapper border-bottom white-bg page-heading">-->
        <!--<div …
Run Code Online (Sandbox Code Playgroud)

typescript angular

12
推荐指数
1
解决办法
6833
查看次数

Docker app server ip 地址 127.0.0.1 与 0.0.0.0 ip 之差

他大家。我正在使用 docker 并尝试 dockerize 一个简单的 django 应用程序,该应用程序将外部 http 连接到网页(真实网站),因此当我在 Docker 文件中设置应该在容器中工作的 django 服务器的地址时 - 127.0 .0.1:8000。我的应用程序无法运行,因为无法与网站建立外部连接。

但是当我为我的服务器设置端口时:0.0.0.0 : 8000它开始工作。

所以我的问题是:为什么它会这样?在这种特殊情况下有什么区别?我只是想了解它。

我读了一些关于 0.0.0.0 的文章,它就像一个允许使用 OC 默认端口的“通用”或“占位符”端口。

127.0.0.1 就像一个主机,将请求重定向到当前机器。我就知道。但是当我在我的本地机器(主机:127.0.0.0:8000)上运行应用程序时,一切正常,应用程序可以连接到真实网站,但在 docker 的情况下它停止工作。

谢谢你的帮助!

这是我的来源:Docker 文件

FROM python:3.6

RUN mkdir /code
WORKDIR /code

COPY requirements.txt ./
RUN pip install --no-cache-dir -r requirements.txt

COPY . ./

EXPOSE 8000

ENTRYPOINT [ "python", "manage.py" ]
CMD [ "runserver", "127.0.0.1:8000" ] # doesn't work
# CMD [ "runserver", "0.0.0.0:8000" ] - works
Run Code Online (Sandbox Code Playgroud)

docker-compose.yml

version: …
Run Code Online (Sandbox Code Playgroud)

django ip tcp docker docker-compose

11
推荐指数
2
解决办法
9510
查看次数

从主应用程序文件中分离出角度2路径配置

我想将路由配置从app文件分成不同的文件,如(routeConfig.ts).有可能的?

例如:

import {Component} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {DashboardComponent} from './dashboard/dashboard.component';


import {MessagesComponent} from '../modules/messages/messages.component';


@Component({
    selector: 'app',
    directives: [
      ROUTER_DIRECTIVES
    ],
    templateUrl: './built/application/app.html'
})

@RouteConfig([
  {
    path: '/',
    name: 'Dashboard',
    component: DashboardComponent,
    useAsDefault: true
  }
])

export class AppComponent {}
Run Code Online (Sandbox Code Playgroud)

我想将@RouteConfig params移动到不同的文件中,然后将其加载到主app文件中.有可能的?谢谢.(路由配置会很大,所以我想分开这个).

第一个麻烦,就是当我尝试将配置移动到不同的文件并尝试在应用程序文件中导入JSON时 - 我得到了未定义组件的错误.因为componentsName s not a string. Can解决了这个问题.

split routes config angular

8
推荐指数
1
解决办法
5709
查看次数

异步加载为Angular 2路由数据和构建路由指令

我尝试从angular2(从服务器获取路由配置)动态构建路由,之后我解析它并生成组件路由的指令(我将父路由配置和子路由到不同的组件,因为我不知道如何为子路径定义路由组件成一个main.app.ts文件).

问题是当应用程序启动并尝试创建路由配置并且routeGenerator不是构建路由时(异步延迟)无法t parse routes data (because async delay, so routesData undefined now) and app is crashig. I don知道如何处理此问题.寻找生命周期引擎盖(有些像 - @ Angular2BeforeAppStarted)却一无所获.

    import {Component, Input, OnChanges} from 'angular2/core';
import {RouteConfig, RouterOutlet, ROUTER_DIRECTIVES, Router} from 'angular2/router';
/* ------- !Angular 2 native components  ---------*/
import {routeGenInstance} from '../../config/routes/patient_routes';


protected const BUILT_MODULE_PATH: string = '/built/modules/patients/';

@Component({
  template: `
    <router-outlet ></router-outlet>
  `,
  directives: [RouterOutlet, ROUTER_DIRECTIVES]
})
@RouteConfig(routeGenInstance.getRouteDefinitions())

export class PatientsComponent {
  @Input();

  constructor() {}

}
Run Code Online (Sandbox Code Playgroud)

此外,我尝试以相同的方式更新路线(但应用程序立即崩溃,因为导航组件中的导航链接没有一些正确的链接方式)

import {RouteConfig, RouterOutlet, ROUTER_DIRECTIVES, Router} from 'angular2/router'; …
Run Code Online (Sandbox Code Playgroud)

asynchronous routes delay angular

8
推荐指数
2
解决办法
7493
查看次数

Tailwind @layer 指令的目的是什么?

我想为我的 UI 创建一些自定义样式,并在 Tailwind 官方文档中描述了 2 个选项来完成它。

\n
    \n
  1. @apply -使用 @apply 将任何现有实用程序类内联到您自己的自定义 CSS 中。
  2. \n
  3. @layer -使用 @layer 指令告诉 Tailwind 一组自定义样式属于哪个 \xe2\x80\x9cbucket\xe2\x80\x9d。
  4. \n
\n

到目前为止,我了解到@apply只是创建一个自定义样式类并将其添加到 Tailwind 系统中。这正是我所需要的,而且很好,但我也想知道@layer指令。

\n根据描述,它向顺风布局系统添加了一桶自定义样式,但我无法理解这一举​​动给我们带来了什么好处。

\n

如果我只使用@apply就这样呢?
会损害性能吗?
\n所以我只是想了解在什么情况下应该使用@layer

\n

感谢您的帮助 | 信息!

\n附言抱歉,如果我的问题很愚蠢。如果是这样,我深表歉意。我是 Tailwind 的新人。

\n

javascript tailwind-css

6
推荐指数
1
解决办法
4042
查看次数