当日期为空时，如何在日期输入字段中显示“ mm / dd / yyyy”而不是“ 12/31/1969”？

Question

本质上，我的数据库中有一列是日期类型，但可以为null。我有一个使用Angular / Bootstrap的表单，该表单允许用户根据需要输入日期，但不必输入日期，为此，我使用Bootstraps表单控件类，并为输入提供日期类型。

第一次为表单加载日期的空值时，一切工作都会保存下来。数据库可以很好地保存它，并且一切都很好。但是，如果数据库中显示的是空值，则当我将记录加载到这种形式时，Angular / Javascript将其显示为12/31/1969，而不是最初加载空值时的“ mm / dd / yyyy”。这会引起问题，因为如果用户保存此表单，它将默认的12/31/1969作为真实日期并将其保存为输入。

我已经通过控制台对其进行了跟踪，并且我100％肯定日期值为null（），当它碰到我的模型绑定时，我想不起来在这种情况下该怎么做，我真的很感谢任何指针。

在提取数据时：

if (myDateFromDatabase !== null) { 
    myDateFromDatabase = new Date(myDateFromDatabase); 
}

鉴于：

<input ng-model="myDateFromDatabase" type="date" class="form-control" />

Answer 1

Angular input[date]必须具有有效的 javascript Date对象，否则它将默认为空字符串，然后默认为12/31/1969。Javascript Date对象必须始终具有有效的Date。

如果希望能够使用可为空的Date对象，则应将默认属性设置为undefined，然后在绑定模型时可以看到它是否为第null一个，如果为空，则不执行任何操作。

var myDateFromDatabase = undefined; // if you get null back from database, you'll keep this undefined

然后，当您提取数据并应用它时...

if (data.dateRetrieved !== null) { 
    // only make myDateFromDatabase an actual date if there is something stored
    myDateFromDatabase = new Date(data.dateRetrieved); 
}

并为您的默认文本添加placeholder属性：

<input ng-model="myDateFromDatabase" type="date" placeholder="mm/dd/yyyy" class="form-control" />