小编Con*_*Fan的帖子

我想将服务注入到不是组件的类中.

例如

为MyService

import {Injectable} from '@angular/core';
@Injectable()
export class myService{
  dosomething(){
    //implementation
  }
}

我的课

import { myService } from './myService'
export class MyClass{
  constructor(private myservice:myService){

  }
  test(){
     this.myservice.dosomething();
  }
}

这个解决方案不起作用(我认为因为MyClass还没有实例化).

有没有其他方法在课堂上使用服务(而不是组件)？或者我设计代码的方式是错误的(在类中使用服务而不是组件)

谢谢.

我在Javascript中制作了一个小日历弹出窗口.非常简单,使用ASP.NET中的Calendar控件.我用showModalDialog调用弹出窗口.在模态窗口中,由于回发,更改日历的当前月份会导致问题,我在几个地方找到了解决方案:

<base target="_self"/>

在aspx文件的头部分.一切都很好......除了一件事,只有谷歌Chrome.要返回所选日期,我将弹出窗口的returnValue设置为日历中选定的日期.在IE和Firefox中,它始终有效.但是,在Chrome中,仅当我不更改日历中的当前月份时,它才有效.一旦我更改它,返回值就不会传递回showModalDialog的调用者.好像模态窗口不再是原始窗口了; 返回值未定义.

有没有人经历过这种行为,并有建议让它发挥作用？我尝试使用dialogArguments来跟踪调用者窗口但它只传递给第一个模态窗口(它在更改当前月份后丢失).

调用过程中的代码:

var d = window.showModalDialog(...)

模态窗口中的代码:

window.returnValue = selectedDate; 
self.close();

正如我对Teemu所说,selectedDate和window.returnValue都是正确的.但是,对于谷歌浏览器(在日历中更改一个月后),showModalDialog不会返回returnValue,并且未定义d.

当用户在浏览器选项卡中手动更改路径并按Enter键时,我遇到了问题.这迫使我的ui-router/angular2-router导航到用户输入的状态.我想阻止这种情况,并且只允许通过我在网站上点击按钮实现的流程进行路由.

我使用导入/导出在es6中编写了一个库.我可以使用Rollup将这个库捆绑到可以在浏览器中使用的iife中.

我也希望能够在其他项目中使用这个库.但是我通常不想要包含整个库,只包含部分库.

因为库是使用es6导入/导出编写的,所以我可以将非捆绑的index.js文件作为依赖项包含在另一个项目中然后import { myFunc } from 'my-lib'这很好用 - 我的项目捆绑时只能得到myFunc.

但是我遇到了一个问题,因为这些文件还没有被babel处理,因此包含es6代码,例如箭头函数.我已经读过,如果你要发布一个库,它不应该被最终用户转换.

我如何获取我的es6库并以这样的方式将其捆绑以便进行转换,还能够导入其各个组件？我想要一个类似lodash如何组织的情况.

这不是最容易表达的事情,所以如果有什么不清楚,请发表评论,我会编辑我的问题,试着澄清.

我使用原生JS实现了一个路径的徒手画.但正如预期的那样,路径边缘不那么具有攻击性且不平滑 所以我可以选择使用simplifyJS来简化点然后重绘路径.但就像这里一样,我不是在绘图后平滑,而是试图在绘图时找到简化的边缘

这是我的代码:

    var x0, y0;

    var dragstart = function(event) {
        var that = this;
        var pos = coordinates(event);
        x0 = pos.x;
        y0 = pos.y;
        that.points = [];
    };

    var dragging = function(event) {
        var that = this;
        var xy = coordinates(event);
        var points = that.points;
        var x1 = xy.x, y1 = xy.y, dx = x1 - x0, dy = y1 - y0;
        if (dx * dx + dy * dy > 100) {
            xy = {
                x: …

我正在尝试创建一个模拟球,其中一个球遵循运动路径,类似于:

https://bl.ocks.org/mbostock/1705868

然而,我不想使用补间,而是希望球的运动由重力和物体的速度决定 - 类似于过山车,就像这样:

https://www.myphysicslab.com/roller/roller-single-en.html

这是我到目前为止所做的,但是有一个小问题,过山车每一帧都会略微增加能量而不是失去能量:

https://jsbin.com/jidazom/edit?html,js,output

x

任何有关如何解决这个问题的建议将不胜感激!

Visual Studio Code 在其Run Tasks菜单中显示已配置和自动检测的任务。我想bin从 npm 任务自动检测中排除该文件夹及其所有子文件夹。该npm.exclude设置似乎是为此目的设计的，但我还没有找到如何使用它。

我尝试了以下变体，但没有成功：

"npm.exclude": "**/bin"
"npm.exclude": "**/bin/"
"npm.exclude": "./bin"
"npm.exclude": "./bin/"
"npm.exclude": "**/bin/*.*"
"npm.exclude": "./bin/*.*"
"npm.exclude": ["**/bin"]
"npm.exclude": ["**/bin/"]
"npm.exclude": ["./bin"]
"npm.exclude": ["./bin/"]
"npm.exclude": ["**/bin/*.*"]
"npm.exclude": ["./bin/*.*"]

用于files.exclude和的语法search.exclude似乎不被允许：

"files.exclude": {
     "**/.git": true,
     "**/.svn": true,
     "**/.hg": true
 }

该npm.exclude设置的适当语法是什么？

我正在创建一个简单的客户管理应用程序。其中一项功能是过滤表格以列出活跃和不活跃的客户。我的问题是当单击下拉菜单时我无法获得布尔值，即真/假，但只有字符串“真”/“假”，因此我的过滤器不起作用。

这是我的 html：

<strong class="ml-2">Active Status</strong>
<select class="ml-1" name="activeStatus" [(ngModel)]="activeStatus">
  <option></option>
  <option value=true>Active</option>
  <option value=false>Not Active</option>
</select>

我的表过滤管：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'tableFilters'
})
export class TableFiltersPipe implements PipeTransform {

  transform(list: any[], filters: Object) {
    const keys = Object.keys(filters).filter(key => filters[key]);
    const filterUser = user => keys.every(key => user[key] === filters[key]);
    return keys.length ? list.filter(filterUser) : list;
  }

}

在 Chrome 中进行调试以查找应用程序中响应缓慢的根源时，我注意到在“性能”选项卡中按住该Shift键会生成重复keydown事件，每个事件都会触发 Angular 中的更改检测。下图显示了其中之一的“性能”选项卡。这些事件对我的应用程序没有用；我知道当Shift和Ctrl受到自身压力时，什么都不会改变。我只想知道当发生单击事件时，或者当按下字符或功能键时，按键是否按下。“性能”选项卡中报告的额外活动也使得分析我的调试实际感兴趣的内容变得更加困难。

有没有办法防止或取消对和keydown等键的全局事件的更改检测？ShiftCtrl

我想知道在 Angular 组件中为可选属性设置默认值的“Angular/Typescript 方式”是什么？当传递给可选属性的值是nullor时，我遇到了麻烦undefined。

目前我有这样的事情：

export class FooComponent implements OnInit {
  @Input() foo = 'foo';
  @Input() bar = 0;
  @Input() baz?: string;
}

如果声明默认值，则不必指定类型，因为它是指定值的类型，默认情况下属性是可选的。bar和foo属性就是这种情况。

或者，您可以使用?标记此属性是可选的，但不能声明其默认值。这就是baz财产的情况。

现在让我们看看当您将不同的值传递给这些属性时会发生什么。

<app-foo-component
  [foo]
  [bar]="null"
  [baz]="undefined"
>
</app-foo-component>

如果我控制台记录这些属性，这就是我得到的：

foo 会正确 'foo'

bar 将会 null

baz 将会 undefined

当传递的值为空/未定义时，是否有一种优雅的方法也可以设置默认值，或者我是否需要像这样在 OnInit 中进行一些检查？

OnInit() {
  this.bar = this.bar || 0;
}

感觉有一些方法可以做到这一点。对我来说，可选属性意味着值可能丢失、为空或未设置，但是当我想设置默认值时，它仅在属性丢失或为空时才有效。在这些情况下，它仍然将 value 设置为 null 或 undefined，这似乎令人困惑。