小编ymr*_*mrs的帖子

我在我的 angular 5 应用程序中使用 jQuery，它运行良好，但我在业力测试方面遇到了问题。

import { ElementRef } from '@angular/core';
declare var jQuery: any;

export class Item {

constructor(private element: ElementRef) {
    this.init();
}

private init() {
    this.$item = jQuery(this.element.nativeElement);
...

错误

参考错误：未定义 jQuery。

包.json

"dependencies": {
  "jquery": "3.1.1"
}

我已将 jquery 添加到我的 karma.conf 中，但这并没有帮助。

files: [
        'node_modules/core-js/client/shim.js',
        'node_modules/systemjs/dist/system.src.js',
        'node_modules/zone.js/dist/zone.js',
        'node_modules/zone.js/dist/proxy.js',
        'node_modules/zone.js/dist/sync-test.js',
        'node_modules/zone.js/dist/jasmine-patch.js',
        'node_modules/zone.js/dist/async-test.js',
        'node_modules/zone.js/dist/fake-async-test.js',
        'node_modules/tslib/tslib.js',
        'node_modules/jquery/dist/jquery.js',

        {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
        {pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
        {pattern: '../karma-test-shim.js', included: true, watched: true},
        {pattern: 'node_modules/@angular/**/*.js', …

我想知道是否有人可以帮助解释为什么我无法动态更改表单输入类型？

例如

<user-input type="{{ isActive ? 'password' : 'text' }}"></user-input>

不起作用。

但这有效

<user-input type="password" *ngIf="isActive"></user-input>
<user-input type="text" *ngIf="!isActive"></user-input>

用户输入

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

@Component({
    selector: 'user-input',
    templateUrl: './user-input.html'
})
export class UserInput {

    @Input()
    public isActive: boolean;

    constructor() {

    }
}

user-input.html

<input 
    type="{{ isActive ? 'password' : 'text' }}" 
    class="form-control"
    [(ngModel)]="value"
/>

user-input-password.ts

import { Directive, HostListener } from '@angular/core';

@Directive({
  selector:
      'input[type=password][formControlName],input[type=password][formControl],input[type=password][ngModel]'
})
export class PasswordValueAccessor {

    public pattern: RegExp;

    private regexMap = /^(?=.*[0-9])(?=.*[!@#$%^&*])[a-zA-Z0-9!@#$%^&*]{6,16}$/;

    @HostListener('keypress', …