时间戳

首页 > 解决方案 > 在选定的日期导航到不同的页面提交

angular - 在选定的日期导航到不同的页面提交

问题描述

我制作了描述预订日历的代码，我希望当我按下提交时，它将通过导航转到不同的页面。该函数应检查开始日期是否大于现在，结束日期是否大于开始日期-当为真时->导航到不同的页面。

提前谢谢你们

<div class="container">
  <div class="row-center">
    <div class="jumbotron">
      <div class="row">
        <div class="col-md-4 col-sm-4">
          <h4 class="red">Start Date</h4>
          <input name="start" type="date" class="form-control " placeholder="Start date">
        </div>
        <div class="col-md-4 col-sm-4">
          <h4 class="red">End Date</h4>
          <input name="end" type="date" class="form-control" placeholder="End date">
        </div>
        <div class="col-md-3 col-sm-2">
          <input id="btnOpen" class="btn btn1 btn-success" type="submit" value="Submit">
        </div>
      </div>
    </div>
  </div>
</div>

标签： angulartypescriptangular5

解决方案

在您的示例中，我找不到任何应在点击时触发的方法。

假设您不知道该怎么做，我正在给出答案。

像这样改变你的html。

<input id="btnOpen" class="btn btn1 btn-success" type="submit" value="Submit" (click)="submitClicked()">

在您的 .ts 文件中，您必须创建一个将在按钮单击事件时触发的函数。这里方法名称是submitClicked(). 所以，代码将是这样的。

submitClicked() {
  //here you will write the logic what should this function do when the submit is clicked
  // you will need something like this
  if(todayDate > start && todayDate < end){
    //navigate to another page
  }
}

如果你不知道如何比较日期或如何在另一个页面中导航，你会发现很多资源。

由于问题不够清楚，而且您是新手，我只是打破部分内容，让您了解它应该如何工作，以便您现在可以自己进行。

推荐阅读