Angular 角度转换日期

我有一个名为month的输入字段

  <span>
        Month: <br />
        <input id="typeahead-basic" type="text" class="form-control month" />
    </span>

月份：

我想做的是，如果你在“月份”字段中键入6，它将自动更改为06，如果你键入2，它将更改为02。所以从1到9的所有值都应该加一个零。 如果我能将其实现到component.ts类中，那就太好了。 多谢各位

编辑： 所以我所做的是： 这在组件中是：

 checkMonth() {
    if (this.month < 1) {
        this.month = "01";
    } else if (this.month > 12) {
        this.month = 12;
    } else if (this.month < 10) {
        this.month = '0' + this.month;
    }
}

checkMonth（）{
如果（本月<1）{
本月=“01”；
}否则如果（本月>12）{
本月=12；
}否则如果（本月<10）{
this.month='0'+this.month；
}
}

这是HTML代码：

<input class="form-control hideSpinners" min=1 max=12 type="number" [(ngModel)]="month"
                (change)="checkMonth()"/>

---

使用简单的HTML是不可能的

您可以做的是在值更改时调用onChange函数

<span>
    Month: <br />
    <input id="typeahead-basic" type="text" class="form-control month" onchange="addZero(this)"/>
</span>

月份：

在组件脚本中

addZero(input) {
    if(input.value > 0 && input.value < 10) input.value = `0${input.value}`;
}

addZero（输入）{
如果（input.value>0&&input.value<10）input.value=`0${input.value}`；
}

示例：（香草JS）

---

（角度）

使用简单的HTML是不可能的

您可以做的是在值更改时调用onChange函数

<span>
    Month: <br />
    <input id="typeahead-basic" type="text" class="form-control month" onchange="addZero(this)"/>
</span>

月份：

在组件脚本中

addZero(input) {
    if(input.value > 0 && input.value < 10) input.value = `0${input.value}`;
}

addZero（输入）{
如果（input.value>0&&input.value<10）input.value=`0${input.value}`；
}

示例：（香草JS）

---

（角度）

切片

如果值为负值，效果会很好：

const input=document.querySelector（'input[type=“text”]#id'）；
input.addEventListener（'blur'，（）=>{
input.value=input.value.length==1？
`0${input.value}`.slice（-2）：
输入值；
});
切片
如果值为负值，效果会很好：


const input=document.querySelector（'input[type=“text”]#id'）；
input.addEventListener（'blur'，（）=>{
input.value=input.value.length==1？
`0${input.value}`.slice（-2）：
输入值；
});
您可以使用ngModel指令。比如：

  <span>
        Month: <br />
        <input name="inputfield" #input [(ngModel)]="month" (input)="changeDate(month)" id="typeahead-basic" type="text" class="form-control month" />
    </span>


月份：


组件中需要一个与ngModel匹配的公共属性，因此在本例中为“月”

然后您只需要编写一个changeDate函数，从输入字段中获取ngModel值并将0添加到其中，这在普通javascript中已经足够简单了。
您可以使用ngModel指令。比如：

  <span>
        Month: <br />
        <input name="inputfield" #input [(ngModel)]="month" (input)="changeDate(month)" id="typeahead-basic" type="text" class="form-control month" />
    </span>


月份：


组件中需要一个与ngModel匹配的公共属性，因此在本例中为“月”

然后您只需要编写一个changeDate函数，从输入字段中获取ngModel值并将0添加到其中，这在普通javascript中已经足够简单了。
使用本机javascript
'9'。padStart（2,0）
如何在组件中实现？绑定到
（输入）
事件并添加填充。您可以将其他事件用于不同的行为<代码>（输入）
在按键时触发<代码>（更改）

在按下enter键时触发<代码>（模糊）在焦点移动时触发。使用本机javascript

'9'。padStart（2,0）

如何在组件中实现此功能？绑定到

（输入）

事件并添加填充。您可以将其他事件用于不同的行为<代码>（输入）在按键时触发<代码>（更改）在按下enter键时触发<代码>（模糊）在焦点移动时触发。非常感谢，我是否需要将addZero函数包含到所谓的导出类中？我不知道你的架构，但我想我添加了这个函数，它告诉我这个函数没有使用，很奇怪。没有使用或没有定义？它告诉我它没有使用。非常感谢，我需要将addZero函数包含到所谓的导出类中吗？我不知道你的架构，但我想我添加了这个函数，它告诉我这个函数是未使用的，非常奇怪。未使用或未定义？它告诉我它是未使用的