小编Alu*_*dad的帖子

我正在使用Typescript和一些由Typescript公开的ES6特征(如ES6 String Literals)开发项目`Something ${variable} Something else`.

在调试问题时,我在我的打字稿文件中删除了一个断点,以便在源面板中逐步执行它,这通常可以正常工作.

但Chrome Dev Tools存在ES6字符串文字的问题,似乎无法识别ES6字符串文字的结尾.

相反,字符串文字后面的所有代码都标记为红色(调试器中的字符串突出显示)并且阻止了变量检查,因为chrome调试器似乎认为它只是一个庞大的字符串.

有人遇到过这个问题,找到了解决方案,或者知道这是否是谷歌Chrome开发工具的路线图？

编辑1:
看起来这个问题目前正由Chromium团队处理.请参阅问题报告以获取更新:
bugs.chromium.org/p/chromium/issues/detail?id=659515

编辑2: Bug已经打开很长一段时间了,但似乎没有被优先考虑.如果您遇到问题,请转到上面的chrome链接,并使用有用信息对其进行星标/评论,以便将其转移到Dev Tools团队的焦点.

我正在研究ng2实现.我正在使用以下函数调用将对象转换为数组:

var authors = Object.entries(responseObject.Authors);

这是标准的js功能.但是,ts编译器返回以下错误:

"Property 'entries' does not exist on type 'ObjectConstructor'"

基于快速谷歌,似乎解决方案可能是将compilerOptions目标属性从es5更改为es6.但是,在之前的一个问题的一些先前的研究之后,我认为我能够通过在我的tsconfig.json上包含额外的"lib"属性来利用es6功能:

  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "commonjs",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../Scripts/",
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "moduleResolution": "node",
    "lib": [
      "es2015",
      "dom"
    ]
  }

我也尝试将目标属性更改为es2015,然后重建项目并执行"typescriptUsingTsConfig",但我仍然得到相同的错误.知道我可以在这里做什么来利用Object.entries()函数？

是否有符号来访问TypeScript中数组的最后一个元素？在Ruby中,我可以说:array[-1].有类似的东西吗？

我有一个包含大约16,500个城市的表的数据库,以及该数据库的EF数据模型(数据库优先).我用代码将它们预加载到内存中:

Db.Cities.Load()

...然后在使用它们的时候,我尝试了以下每个查询:

Dim cities() As String = Db.Cities.Select(Function(c) c.CityName).ToArray

Dim cities() As String = Db.Cities.Local.Select(Function(c) c.CityName).ToArray

第一个查询是快速的(约10毫秒),但是第二个查询第一次运行大约需要2.3秒(尽管它比第一个查询在此之后调用时更快).

这没有意义,因为SQL Server Profiler验证第一个查询是在另一台机器上命中数据库,但第二个查询不是!

我试过关掉Db.Configuration.AutoDetectChangesEnabled,我试过预先生成视图.

我能做些什么来.Local加快速度？(并非所有运行此应用程序的客户端都将位于快速LAN上.)

我有一个表,我想在其中显示一个表行,这是一个组件.而且我还想将数据传递给该组件:

<table>
    <th>
        <td>col 1</td>
        <td>col 2</td>
        <td>col 3</td>
    </th>
    <tr>
        <my-component [data1]="data1" [data2]="data2"></my-component>
    </tr>
    <tr *ngFor="let item of list">
        {{item}}
    </tr>
</table>

在my-component,HTML是少数几个<td></td>从data1和呈现的数据data2.

但是在渲染之后,由于<my-component></my-component>我的CSS破坏导致所有my-componentHTML(整个表行)显示在第1列中.

结果如上:

<table>
    <th>
        <td>col 1</td>
        <td>col 2</td>
        <td>col 3</td>
    </th>
    <tr>
        <my-component>
            <td>data1.prop1</td>
            <td>data1.prop2</td>
        </my-component>
    </tr>
    <tr *ngFor="let item of list">
        {{item}}
    </tr>
</table>

我尝试了以下方法:

@Component({
    selector: '[my-component]',
    templateUrl: 'my-component.html'
})

<tr my-component [data1]="data1" [data2]="data2"></tr>

但这会导致错误Can't bind to 'data1' since it isn't …

我最近发现,页面的性能受到在其模板上多次使用的角度指令的极大阻碍.在以下代码中找到了性能降低的原因:

@HostListener('window:keydown', ['$event'])
private keydown(e: KeyboardEvent) {
     this.doSomething(e);
}

我怀疑问题可能是由于在窗口keydown事件上注册多个事件侦听器引起的,因为每次在页面上重复该指令时都会注册一个新事件.为了测试该理论,我使用RxJS Subject创建了一个服务来处理该键盘事件:

@Injectable()
export class KeyboardService {
    constructor() {
        window.addEventListener('keydown', event => {
            this.keydownSubject.next(event);
        });
    }
}

private keydownSubject: Subject<KeyboardEvent> = new Subject<KeyboardEvent>();

get keydown(): Observable<KeyboardEvent> {
    return this.keydownSubject.asObservable();
}

然后我删除了@HostListener指令,并在ngOnInit中订阅了这个服务的主题:

export class KeydownEventDirective implements OnInit, OnDestroy {
    constructor(private keyboardService: KeyboardService) {}

    private keydown(e: KeyboardEvent) {
        this.doSomething(e);
    }

    private keydownSubscription: Subscription;
    ngOnInit() {
        this.keydownSubscription =
            this.keyboardService.keydown.subscribe(e => {
                this.keydown(e);
            });
    }

    ngOnDestroy() {
        this.keydownSubscription.unsubscribe();
    }

    ...
}

解决方案加速了页面,我很难发现为什么会出现这种情况.为什么@HostListener …

虽然在ES6中有部分Node.js,但是可以在同一个项目中混合一些Typescript模块吗？

例如,在TypeScript中定义了一些通过require普通ES6文件导入的类型？

我想弄清楚使用 Pinia store 而不是仅使用纯 ts 可组合函数（例如

const userName = ref('')

export default function useUser() {

  const setUserName(name: string) => {
    userName.value = name
  }

  return {
    userName: readonly(userName),
    setUserName
  }

}

然后使用

const {userName, setUserName} = useUser()

因为，例如在此 Vitesse 示例https://github.com/antfu/vitesse/blob/main/src/stores/user.ts中，Pinia 的用法看起来非常相似。

感谢您的澄清:)

我们的项目结构如下:Angular2-webpack-starter.

我们的项目成功编译,构建并可在浏览器中看到.这里没问题.

但是当我们尝试运行测试用例时,karma and jasmine我们会收到此错误.

XXXXComponent
   :heavy_multiplication_x: Should Match Current Tab as 1
     Chrome 55.0.2883 (Mac OS X 10.10.5)
   Error: Unexpected value 'FormGroup' declared by the module 'DynamicTestModule'
       at SyntaxError.ZoneAwareError (webpack:///~/zone.js/dist/zone.js:811:0 <- config/spec-bundle.js:74048:33)
       at SyntaxError.BaseError [as constructor] (webpack:///~/@angular/compiler/src/facade/errors.js:26:0 <- config/spec-bundle.js:78913:16)
       at new SyntaxError (webpack:///~/@angular/compiler/src/util.js:151:0 <- config/spec-bundle.js:6408:16)
       at webpack:///~/@angular/compiler/src/metadata_resolver.js:475:0 <- config/spec-bundle.js:19829:40
       at Array.forEach (native)
       at CompileMetadataResolver.getNgModuleMetadata (webpack:///~/@angular/compiler/src/metadata_resolver.js:457:0 <- config/spec-bundle.js:19811:54)
       at JitCompiler._loadModules (webpack:///~/@angular/compiler/src/jit/compiler.js:165:25 <- config/spec-bundle.js:55462:64)
       at JitCompiler._compileModuleAndAllComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:144:25 <- config/spec-bundle.js:55441:52)
       at JitCompiler.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/src/jit/compiler.js:98:0 <- config/spec-bundle.js:55395:21)
       at TestingCompilerImpl.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/bundles/compiler-testing.umd.js:482:0 …

我最近在代码中遇到了一个错误，这是由于我在 MDN 上查看 Map 对象详细信息时缺少“按插入顺序”文本。简而言之，我有一个地图对象，可以说

let myMap = new Map;

然后，在填充它之后，我用一个简单的for .. of语句迭代它的内容。像这样

for (let [key, val] of myMap) { 
    ...
}

for循环中的代码依赖于 (key, value) 对按key排序。然而，填充地图的算法是以随机顺序执行的（我无法更改它）。为了解决这个问题，我现在首先将所有可能的键添加到地图对象中，如下所示：

let myMap = new Map;
for (let i=0; i<maxkey; ++i) myMap.set(key(i), undefined);

// And in the for loop
for (let [key, val] of myMap) {
    if (typeof val === "undefined") continue;
    //...
}

幸运的是，它们的数量并不多（因此性能损失可以忽略不计），而且这是有效的。不过这个解决方案对我来说看起来有点尴尬。

还有更好的吗？