检查日期正确+正则表达式Angular4

时间:2018-10-24 10:11:15

标签: html angular

我在Angular4中有一个表单,其中有2个日期:开始,完成。

我要检查格式日期是dd / mm / yyyy。

我写道:

var values = ["temperature","humidity"];

var y = d3.scaleLinear()
          .domain([0,d3.max(data, d => d[value] )])
          .range([height,0]);
var line = d3.line()
             .x(d => x(parseDate(d.date)) )
             .y(d => y(d[value]) );

然后,当我输入无效的日期时,我的html什么也没说...我可以发送此表格。

enter image description here

然后我需要检查这些日期。

     <input  pattern="((0)*[1-9]|[1-2][0-9]|(3)[0-1])(\/)(((0)*[1-9])|((1)[0-2]))(\/)\d{4}$" [(ngModel)]="filterDateStart" class="form-control" type="date" id="filterDateStart" name="filterDateStart"  clrDate>

    <input   pattern="((0)*[1-9]|[1-2][0-9]|(3)[0-1])(\/)(((0)*[1-9])|((1)[0-2]))(\/)\d{4}$" [(ngModel)]="filterDateEnd" class="form-control" type="date" id="filterDateEnd" name="filterDateEnd"  clrDate>

我看到了库moment.js,但是老板说我不应该这样。谢谢,抱歉我的英语。

1 个答案:

答案 0 :(得分:1)

不使用正则表达式,而是依靠Date API:

const valid = '12/12/2018';
const invalid1 = '12/12';
const invalid2 = '12.12.2018';
const invalid3 = 'foo';

function parseDate(date) {
  try {
    // Make your business logic here. Examples : all must be defined and numbers, and separated with a /
    const [d, m, y] = date.split('/');
    
    if (!d || !m || !y) throw new Error();
    
    if(isNaN(d) || isNaN(m) || isNaN(y)) throw new Error();
    
    return new Date(y, m, d);
  } catch(err) {
    return 'Invalid date';
  }
}

console.log(parseDate(valid));
console.log(parseDate(invalid1));
console.log(parseDate(invalid2));
console.log(parseDate(invalid3));

有了它,您可以创建一个自定义验证器,这比使用模式要明确得多。