小编And*_*ill的帖子

我们这是写在SystemJS版本的旧代码0.21.3。我们正在尝试使用最新版本的SystemJS从内存中的JavaScript变量动态加载模块。

谁能指出我的最新替代方案registerDynamic，然后import再说相同。

基本上，我们需要在最新版本的SystemJS中编写此代码。如果可以使用任何其他框架完成此操作，那也很好。

import * as _dal from 'data-access-layer';
import * as _ngbForms from '@ng-bootstrap/ng-bootstrap';
import * as _ngCommon from '@angular/common';
import * as _ngCore from '@angular/core';
import * as _ngForms from '@angular/forms';
import * as _ngHttpClient from '@angular/common/http';

@Component({
  selector: 'app-custom-mod',
  templateUrl: './custom-mod.component.html',
  styleUrls: ['./custom-mod.component.css']
})
export class CustomModComponent implements OnInit {

  ngOnInit() {
    this.LoadComponent()
  }

  LoadComponent() {
    SystemJS.set('@angular/core', SystemJS.newModule(_ngCore));
    SystemJS.set('@angular/common', SystemJS.newModule(_ngCommon));
    SystemJS.set('@angular/forms', SystemJS.newModule(_ngForms));
    SystemJS.set('@angular/common/http', SystemJS.newModule(_ngHttpClient));
    SystemJS.set('@ng-bootstrap/ng-bootstrap', SystemJS.newModule(_ngbForms))

    const normalized = SystemJS.normalizeSync("@customModule-" + …

我有一个对话框表单，我想在用户按下转义键时优雅地关闭它。当用户按下转义键时，表单会立即关闭，但由于某种原因，对话框表单不会将结果发送到父表单。

通过取消按钮关闭时没有问题。

我已经在userform组件上使用“onKey”事件进行了尝试，但这也不起作用。

在我的打字稿和模板对话框文件中：

import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';

constructor(
  private dialogRef: MatDialogRef<UpdateBonusConditieComponent>,
  @Inject(MAT_DIALOG_DATA) private PassedData: ConditieTypeDialog,
) {}  // I also tried it with a public PassedData instead of private

onCancel() {
  console.log('komt ie hier');
  this.PassedData.cancel = true;
}

onKey(event: any) { 
  this.onCancel();
  console.log('toets ingedrukt ' + event.target);
}

onOK() {
  console.log('OK button pressed');
}

<mat-dialog-content [formGroup]="dialogConditieForm"
                    (keyup)="onKey($event)">

</mat-dialog-content>

<mat-dialog-actions>
  <button mat-button
          color="accent"
          (click)="onOK()"
          [mat-dialog-close]="PassedData"
          [disabled]="dialogConditieForm.invalid">Ok</button>
  <button mat-button
          color="warn"
          (click)="onCancel()"
          [mat-dialog-close]="PassedData">Cancel</button>
</mat-dialog-actions>

然后我有我调用对话框的父表单，一些细节：

import { …

我正在寻找一种通过值而不是键来过滤地图的方法.我有一个在我的Angular应用程序中建模如下的数据集:

{
  "85d55e6b-f4bf-47bb-a988-78fdb9650ef0": {
    is_deleted: false,
    public_email: "007@example.org",
    id: "85d55e6b-f4bf-47bb-a988-78fdb9650ef0",
    modified_at: "2017-09-26T15:35:06.853492Z",
    social_url: "https://facebook.com/jamesbond007",
    event_id: "213b01de-da9e-4d19-8e9c-c0dae63e019c",
    visitor_id: "c3c232ff-1381-4776-a7f2-46c177ecde1c",
  },
}

这些条目上的键id与条目值上的字段相同.

给定其中几个条目,我想过滤并返回一个new Map()只包含给定条目的条目event_id.如果这是一个数组,我会做以下事情:

function example(eventId: string): Event[] {
  return array.filter((item: Event) => item.event_id === eventId);
}

本质上,我试图复制功能Array.prototype.map()- 只是在地图而不是数组.

我愿意使用Lodash,如果它能以更简洁的方式帮助实现这一点,因为它已经在我的项目中可用.

在我的前端项目中，我一直在他们自己的文件中放置不同的“工具配置”。

例如： babel in babel.config.js、 jest in jest.config.js、 eslint in an.eslintrc.json等。

然而，我最近注意到，可以将许多这些配置直接放在项目package.json文件中。

我在网上做了一些挖掘并询问了一些同事，但似乎没有人能给我一个明确的答案，为什么人们可能更喜欢一种方法而不是另一种方法。

这纯粹是喜好问题吗？

为什么表格行内的按钮不起作用？

我只希望它通过在modal-basic.ts文件中调用一个函数在控制台中显示一条消息。

modal-basic.html：

<td><button (click)="test()">Test</button></td>

modal-basic.ts：

test() {
  console.log("Test...");
}

您可以在以下StackBlitz中找到一个最小的可复制示例：https ://stackblitz.com/edit/angular-bpp4uh

我正在努力对齐按钮和<Typography>组件对齐在同一行：

这是我到目前为止所拥有的：

<Grid item lg={12} md={12} sm={12} xs={12} className={classes.register}>\n    <Typography noWrap className={classes.typoText} variant="subtitle2">\n        text1\n    </Typography>\n\n    <ButtonBase className={classes.labelForgot} disableFocusRipple="false" disableRipple="false" centerRipple="false">\n        <Typography noWrap className={classes.labelForgot} variant="subtitle2">\n            text2\n        </Typography>\n    </ButtonBase>\n</Grid>\n

我的风格：

labelForgot: {\n    color: \'rgba(20, 176, 12,0.9)\',\n    backgroundColor: \'transparent\',\n    paddingLeft: 2,\n    \'&:hover\': {\n        color: \'rgb(57, 232, 48)\',\n        backgroundColor: \'transparent\',\n    }\n},\nroot: {\n    backgroundSize: \'cover\', \n    backgroundPosition: \'center center\',\n    backgroundRepeat: \'no-repeat\',\n    minHeight: \'100vh\',\n    justifyContent:\'center\', \n    overflow: \'hidden\',\n},\ngridMain: {\n    margin: \'0 auto\',\n    maxWidth: 300,\n},\n

基本上我有一个<div>允许高度为 \xc2\xb4100%` 的。 …

我正在尝试遵循此示例，但在使用时遇到问题combineLatest()：

Property 'subscribe' does not exist on type 'OperatorFunction<unknown, [unknown, Item[], User[]]>'

这是我的门面：

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { combineLatest, distinctUntilChanged, map } from 'rxjs/operators';

export interface User {
  test: string;
}

export interface Item {
  test: string;
}

interface State {
  items: Item[];
  users: User[];
}

let _state: State = {
  items: [],
  users: [],
};

@Injectable()
export class Facade { …

Safari根据caniuse完全支持FlexBox.

我只是尝试使用flexbox将一些不同大小的div叠加在一起.我真的很好奇为什么它适用于Chrome/Firefox但不适用于Safari:

<div class="container">
  <div class="inner-one"></div>
  <div class="inner-two"></div>
</div>

.container {
  width: 15rem;
  height: 15rem;
  border-radius: 50%;
  background-color: blue;

  display: flex;
  align-items: center;
  justify-content: center;
}

.container div {
  position: absolute;
}

.inner-one {
  width: 13rem;
  height: 13rem;
  border-radius: 50%;
  background-color: green;
}

.inner-two {
  width: 11rem;
  height: 11rem;
  border-radius: 50%;
  background-color: purple;
}

请参阅JSFiddle:https://jsfiddle.net/19n95exf/3/

我正在tsc终端运行。

每次我保存文件时，TypeScript 编译器都会发出：

[2:05:49 PM] 检测到文件更改。开始增量编译...
[2:05:49 PM] 发现 0 个错误。监视文件更改。

如何防止 TypeScript 编译器输出这些消息？我想要在保存时进行“静默”编译，但我似乎在文档中找不到任何适用的标志。

谢谢。

我有一个已经构建好的 Angular 6 应用程序。现在我们计划将其支持为多种语言。我能够创建多个 xlf 文件并将目标字符串替换为语言。我的语言环境文件有三个文件，如messages.en.xlf、messages.es.xlf 和messages.fr.xlf，每个文件分别用于英语、西班牙语和法语。

根据浏览器的语言，应用程序应选择所需的语言文件。如果浏览器设置为法语，它应该会自动提取 messages.fr.xlf 并以法语显示应用程序。

起初我的命令，会是ng build --prod --output-hashing all，但与定位的改变，我需要使用--aot=false，并--build-optimizer=false与我的应用程序的性能和加载时间变差。

ng build  --prod --output-hashing all --aot=false --build-optimizer=false

我的 main.ts 文件如下所示：

ng build  --prod --output-hashing all --aot=false --build-optimizer=false

我想知道是否有一种正确的方法可以根据浏览器的语言加载 xlf 文件而不会出现性能问题并且不会使 AOT 为假。