小编Neo*_*ist的帖子

使用字符串类型参数访问枚举时出现TypeScript TS7015错误

我是TypeScript的新手,我不明白我需要做些什么来修复生成TS7015错误的行(使用字符串变量引用枚举成员),因为紧跟其后的行不会出错(引用枚举成员)使用字符串文字):

enum State {
    Happy = 0,
    Sad = 1,
    Drunk = 2
}

function Emote(enumKey:string) {
    console.log(State[enumKey]); // error TS7015: Element implicitly has an 'any' type because index expression is not of type 'number'.
    console.log(State["Happy"]); // no error
}
Run Code Online (Sandbox Code Playgroud)

"noImplicitAny": true在项目中设置tsconfig.json检测到错误

"noImplictAny": false在项目中设置tsconfig.json没有检测到错误

我正在编译 "ntypescript": "^1.201603060104.1"

我正在编译 "tsc": "1.8.10"

C:>npm install -g typescript

`-- typescript@1.8.10
Run Code Online (Sandbox Code Playgroud)

验证安装:

C:\>tsc --version

Version 1.8.10
Run Code Online (Sandbox Code Playgroud)

这是我的tsconfig.json档案:

{
  "compileOnSave": true,
  "compilerOptions": {
    "target": "ES5",
    "module": "System",
    "moduleResolution": …
Run Code Online (Sandbox Code Playgroud)

typescript

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

如何使用多个选择器定义Angular 2组件或指令

目标:

为我的应用程序中的组件和指令提供"同义词"选择器.

动机:

有时,组件或指令提供可以以不同方式考虑的功能,而选择器的名称应有意义地表示或简化组件或指令如何操作的思考(名称是助记设备).

研究:

指令

我曾观察到,材料2提供了似乎是它的多个选择MdListMdListItem指令:

https://github.com/angular/material2/blob/master/src/lib/list/list.ts

@Component({
  moduleId: module.id,
  selector: 'md-list, md-nav-list',
  host: {'role': 'list'},
  template: '<ng-content></ng-content>',
  styleUrls: ['list.css'],
  encapsulation: ViewEncapsulation.None
})
export class MdList {}
Run Code Online (Sandbox Code Playgroud)

...和...

@Component({
  moduleId: module.id,
  selector: 'md-list-item, a[md-list-item]',
  host: {
    'role': 'listitem',
    '(focus)': '_handleFocus()',
    '(blur)': '_handleBlur()',
  },
  templateUrl: 'list-item.html',
  encapsulation: ViewEncapsulation.None
})
export class MdListItem implements AfterContentInit {
    ...
}
Run Code Online (Sandbox Code Playgroud)

从文档中的Angular 2属性指令页面:

https://angular.io/docs/ts/latest/guide/attribute-directives.html

@Directive需要一个CSS选择器来识别模板中与我们的指令相关联的HTML.属性的CSS选择器是方括号中的属性名称.我们的指令选择器是[myHighlight].Angular将在模板中找到具有名为的属性的所有元素 myHighlight.

哪个链接到以下属性选择器MDN页面:

https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

从Angular 2 Cheat Sheet页面:

https://angular.io/docs/js/latest/guide/cheatsheet.html

在此输入图像描述


list.ts我找到的Material 2 …

css angular

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

有条件地添加指令

我想一个指令有条件地添加到组件(其中au-disabled,au-accentedau-focused是指令):

<template [ngIf]="disabled">
    <au-placeholder au-disabled></au-placeholder>
</template>

<template [ngIf]="accented">
    <au-placeholder au-accented></au-placeholder>
</template>

<template [ngIf]="focused">
    <au-placeholder au-focused></au-placeholder>
</template>
Run Code Online (Sandbox Code Playgroud)

上面的方法有效(并且在某种程度上可以接受)因为(在我的情况下)条件属性disabled,accented并且focused是相互排斥的 - 我的问题出现在条件属性不相互排斥的情况下(要求[ngIf]每个排列应用于相应的变形形式):

<!-- all of the prior <template [ngIf]= ... -->

<!-- plus -->

<template [ngIf]="disabled && accented">
    <au-placeholder au-disabled au-accented></au-placeholder>
</template>

<template [ngIf]="disabled && accented && focused">
    <au-placeholder au-disabled au-accented au-focused></au-placeholder>
</template>

<!-- etc -->
Run Code Online (Sandbox Code Playgroud)

使用以下代码允许我的代码使用较少的HTML来处理组合:

<au-placeholder [au-disabled]="disabled" [au-accented]="accented" [au-focused]="focused"></au-placeholder>
Run Code Online (Sandbox Code Playgroud)

但是渲染的HTML总是具有所有带有真值的指令......组件必须测试每个指令的真值以便适当地响应,但是甚至不应用无关指令也会更清晰.有一个更好的方法吗?

angular

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

如何动态绑定复选框Angular 2的值

大家好:我有一个组件.组件视图有一个表:

<div class="container">
<h2>Recipients List</h2>
<br>
<table class="table table-striped">
    <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Phone</th>
            <th>Status</th>
            <th>Select</th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="#rp of arrAll">   
            <td>{{rp.id}}</td>             
            <td>{{rp.name}}</td>
            <td>{{rp.phone}}</td>                
            <td>{{rp.isActivated?'Active':'Inactive'}}</td>             
            <td>
                <input #{{rp.id}}  type="checkbox" (change)="checkbox(value)">
            </td>
        </tr>          
    </tbody>
</table>

<button class="btn btn-success" (click)="newRecipient()">New Recipient</button>
<button class="btn btn-danger pull-right" (click) ="deleteRecipients()">Delete Recipients</button>
Run Code Online (Sandbox Code Playgroud)

这是使用*ngFor生成的表视图图像的链接.

业务逻辑是"单击删除按钮时,必须删除所有已检查的收件人".我想将一个参数传递给我的删除函数(我认为应该是一个包含已检查的收件人ID的数组)

这是我的组件代码:

import {Component} from 'angular2/core';
import {CORE_DIRECTIVES} from 'angular2/common';
import { Router, RouteParams } from 'angular2/router';
import {RecipientsService}    from'../../services/recipients/recipients.service';
import {Recipient} from '../../models/recipient/recipient';

@Component({
selector: 'recipient-list-view',
templateUrl: './app/components/recipient-list-view/recipient-list-view.html', …
Run Code Online (Sandbox Code Playgroud)

angular2-directives angular

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

如何使用 Javascript 从现有音频元素获取 Blob 数据

我知道mp3文件在我的服务器中的位置。我已将它加载到我的视图中,<audio>元素可以播放它。现在我想从<audio>元素中提取加载的 blob 数据。我在网上找到了一些例子,但这些只展示了如何使用<input>元素上传文件。

我想知道如何从这样的现有<audio>元素中获取二进制数据:

<audio id="myAudio" src="/Media/UserData/mp3DataFolder/5f67889a-0860-4a33-b91b-9448b614298d.mp3"></audio>
Run Code Online (Sandbox Code Playgroud)

从现在开始谢谢。

javascript audio binary blob

10
推荐指数
2
解决办法
5343
查看次数

从Windows命令行运行tsc

npm已安装并正在从IntelliJ IDEA 15中使用

我的目标是在IntelliJ中为我的TypeScript源代码生成输入,但我想学习使用Windows命令行,因此我可以显式指定命令行选项以修改每个选项的功能.我很困惑与设置和使用谷歌相关的各种花絮...我确信我遗漏了一些非常基本的东西,那些博客或回答问题的人都认为是常识. .

这是我尝试过的以及我所看到的......

第1步:安装打字稿:

npm install -g typescript

这导致我的系统上安装了以下文件/目录结构:

C:\Users\{my user id}\AppData\Roaming\npm\node_modules\typescript
|---bin
|   |--- tsc
|   |--- tscserver
|---lib
|   |--- lib.core.d.ts
|   |--- ...
|   |--- typescriptServices.js
|--- .npmignore
|--- ...
|--- ThirdPartyNoticeText.txt
Run Code Online (Sandbox Code Playgroud)

第2步:天真地尝试tsc直接从Windows命令行运行:

我通过Google搜索找到的示例采用以下形式:

编译单个文件:

tsc app.ts

以上示例来自http://www.primordialcode.com/blog/post/typescript-command-line-compiler

这不起作用,因为:

  1. 安装目录tsc不在Windows上,显然这很容易通过更改Window PATH环境变量和/或在输入要执行的命令时完全限定文件路径来解决或解决.Path C:\Users\{my user id}\AppData\Roaming\npm\node_modules\typescript\bintsc

  2. 更重要的tsc是,该文件不是Windows可执行文件... #!Unix脚本(shebang)是一个死的赠品.

检查tsc文件:

#!/usr/bin/env node
require('../lib/tsc.js')
Run Code Online (Sandbox Code Playgroud)

第3步:尝试tsc从节点命令提示符运行:

C:\>node

> …

windows node.js typescript

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

"@ angular/router":"3.0.0-beta.2":routerLink到(主要和辅助)路由器插座无法解析

我想填充主要<router-outlet>和辅助<router-outlet>[routerLink]-当我刚填充初级<router-outlet>它的工作原理,当我刚填充辅助<router-outlet>的也可以,但是我尝试填充两者同时是不能够解决一个或两个的路线.

App路线

const APP_ROUTES:RouterConfig = [
    {path:'', pathMatch:'full', component:EmptyComponent},
    {path:'dog', pathMatch:'prefix', component:DogComponent},
    {path:'bird', pathMatch:'prefix', outlet:'under', component:BirdComponent}
];
Run Code Online (Sandbox Code Playgroud)

应用组件

@Component({
  selector: 'my-app',
  template: `
  <h3>Auxiliary Router Outlets</h3>
  <hr>
  <ul>
  <li><a [routerLink]="['']">Clear</a></li>
  <li><a [routerLink]="['dog']">Over Dog</a></li>
  <li><a [routerLink]="['under:bird']">Under Bird</a></li>
  <li><a [routerLink]="['dog(under:/bird)']">Over Dog & Under Bird</a></li>
  </ul>
  <hr>
  <router-outlet></router-outlet>
  <hr>
  <router-outlet name='under'></router-outlet>
  `,
  directives: [ROUTER_DIRECTIVES]
})
Run Code Online (Sandbox Code Playgroud)

这是Plunker,它展示了我如何设置所有内容:

http://plnkr.co/edit/PI7qaWLVwG6CYOwm7iJC?p=preview

我研究过Victor Savkin关于Angular2 3.0.0路由器的博客文章:

http://victorsavkin.com/post/145672529346/angular-router

但该帖已关闭以征求意见......

我有一篇关于AngularJS Google网上论坛的帖子:

https://groups.google.com/forum/#!topic/angular/mAKbiQgxibg

官方文档"戏弄"主题:

https://angular.io/docs/ts/latest/guide/router.html

angular-ui-router angular

6
推荐指数
0
解决办法
297
查看次数

如何向在 &lt;router-outlet&gt; 之后注入的组件添加指令

我有一个通过以下方式加载的组件<router-outlet>

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

@Component({
    moduleId: module.id,
    selector: 'sandbox',
    templateUrl: 'sandbox.component.html',
    styleUrls: ['sandbox.component.css']
})
export class SandboxComponent implements OnInit {
    @Input() myDirective;

    constructor() {}

    ngOnInit() {}
}
Run Code Online (Sandbox Code Playgroud)

从以下router-link位置调用<router-outlet>

<a routerLink="sandbox">{{i18n.sandbox}}</a>

<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)

Angular 正在渲染<sandbox>紧随以下内容的组件<router-outlet>

<a routerLink="sandbox">{{i18n.sandbox}}</a>

<router-outlet></router-outlet>
<sandbox>
    Sandbox Text
</sandbox>
Run Code Online (Sandbox Code Playgroud)

当 Angular 渲染时<sandbox>,我希望它无条件地将 ( myDirective) 添加到<sandbox>渲染中的元素,HTML如下所示:

<router-outlet></router-outlet>
<sandbox>
    <div myDirective>
        Sandbox Text
    </div>
</sandbox>
Run Code Online (Sandbox Code Playgroud)

我可以通过将 a 嵌套为模板内的直接子级来获得myDirectiveinside的效果,但不喜欢简单地添加 the 来应用指令。 …

angular

5
推荐指数
0
解决办法
882
查看次数

PostgreSQL RDS 在使用 dblink_connect() 时避免硬编码连接密码

我的PostgreSQL的AWS RDS实例中,我需要执行一个SQL使用函数内声明dblink_connect(text),并dblink_exec(text)在登入的postgres角色(我创建)。

CREATE OR REPLACE FUNCTION application.create_tenant_schemas(first integer, last integer) RETURNS void AS
DECLARE
  tenant VARCHAR;
  sql VARCHAR;
BEGIN
  FOR index IN first..last LOOP
    tenant := 'tenant_' || to_char(index, 'FM00000');

    sql := 'CREATE SCHEMA ' || quote_ident(tenant);
    RAISE NOTICE '%', sql;

    PERFORM dblink_connect('dbname=application user=postgres');
    PERFORM dblink_exec(sql);
    PERFORM dblink_disconnect();

  END LOOP;
END;
$BODY$
LANGUAGE plpgsql;
Run Code Online (Sandbox Code Playgroud)

dblink_exec()是生产以下错误消息:

[2F003] ERROR: password is required
Detail: Non-superusers must provide a password in the connection string. …
Run Code Online (Sandbox Code Playgroud)

sql postgresql plpgsql rds amazon-rds

5
推荐指数
1
解决办法
2496
查看次数

Angular 12 aws-sdk 2.910.0 错误:找不到模块:错误:无法解析“.\.\.\node_modules\aws-sdk\lib”中的“util”

在从 Angular 11 移动到 12 之前,没有发生以下错误,应用程序能够使用该aws-sdk库访问我的 S3 存储桶:

./node_modules/aws-sdk/lib/event_listeners.js:572:21-44 - Error: Module not found: Error: Can't resolve 'util' in 'S:\Source\sttutter-ui\node_modules\aws-sdk\lib'
Did you mean './util'?
Requests that should resolve in the current directory need to start with './'.
Requests that start with a name are treated as module requests and resolve within module directories (S:/Source/sttutter-ui, node_modules).
If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind …
Run Code Online (Sandbox Code Playgroud)

aws-sdk angular

5
推荐指数
1
解决办法
1357
查看次数