【问题标题】:stackblitz example do not work as expectedstackblitz 示例无法按预期工作
【发布时间】:2020-06-10 10:13:22
【问题描述】:

为了以后发帖的需要,我需要制作以下 stackblitz 示例。但什么也没出现:https://stackblitz.com/edit/angular-ivy-nzt8oc?file=src%2Fapp%2Fapp.component.html

【问题讨论】:

  • 简单地声明$ 是行不通的。你需要import * as $ from 'jquery';

标签: jquery angular stackblitz


【解决方案1】:

请查看documentantion
只需使用:

import { Component, VERSION, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import $ from 'jquery';
import datepickerFactory from 'jquery-datepicker';

datepickerFactory($);

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
  name = 'Angular ' + VERSION.major;

  public dialogFormGroup: FormGroup;

  constructor(private formBuilder: FormBuilder){}

  ngOnInit() {
    this.dialogFormGroup = this.formBuilder.group({
      creditTerminationDate: ['', Validators.required]
    });
    let that = this;
    $( "#datepicker" ).datepicker({
            dateFormat: "dd/mm/yy",
            onSelect: function (dateText) {
              that.dialogFormGroup.get('creditTerminationDate').setValue(dateText);
              that.dialogFormGroup.get('creditTerminationDate').markAsTouched();
              that.dialogFormGroup.get('creditTerminationDate').updateValueAndValidity();              
              console.log('creditTerminationDate validity');
              console.log(that.dialogFormGroup.get('creditTerminationDate').valid);

            }
        });
  }  
}

【讨论】:

  • 第一个 stackblitz 表明它找不到模块 jquery 和 jquery-datepicker,尽管我将它添加为依赖项,第二,它仍然不起作用。你为什么对我的问题打分?
猜你喜欢
  • 2013-10-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-12-23
  • 2014-12-09
  • 2016-01-13
  • 2020-09-21
  • 2011-08-17
相关资源
最近更新 更多