Javascript 单击“角度材质md日期选择器”时引发错误

我是新来的，最近使用Angular Material 0.11.0提供的md datepicker出现了一些问题：

简而言之，“我的应用”允许用户添加带有名称和说明的单个项目。他们还能够更新相关的项目细节

添加和更新都是通过“材质设计”对话框在中完成的。 一旦用户单击“添加”或“更新”，控制器将调用相关函数，该函数将调用我的工厂中的相应函数

工厂函数包含我配置的$mdDialog服务。 在添加md datepicker之前，我能够毫无问题地进行更新和添加

我在单击编辑时出现以下错误

TypeError: date.toLocaleDateString is not a function
at Object.defaultFormatDate [as formatDate] (angular-material.js:6858)
at DatePickerCtrl.configureNgModel.ngModelCtrl.$render (angular-material.js:7182)
at Object.ngModelWatch (angular.js:25353)
at Scope.parent.$get.Scope.$digest (angular.js:15751)
at Scope.parent.$get.Scope.$apply (angular.js:16030)
at done (angular.js:10545)
at completeRequest (angular.js:10717)
at XMLHttpRequest.requestLoaded (angular.js:10658)

环顾四周后，我发现我应该配置md datepicker。 我从$mdDateLocaleProvider获得灵感，并将以下代码作为.config添加到我的主AngularJS应用程序中（我使用momentjs根据用户的区域设置为用户提供日期）

现在，我可以在我的“添加”工厂中添加具有以下代码的项目。我甚至可以添加我选择的日期，我可以在大纪元时间将其保存到firebase

        return $mdDialog.show({
            clickOutsideToClose: true,
            controller: function($mdDialog) {
                var vm = this;
                vm.project = project;
                vm.add = function(project) {
                    var date = new Date();
                    project.deadline = date.getTime();

                    if(project.deadline == undefined) {
                        project.deadline = null;
                    };

                    FBprojects.$add(project);
                    console.log(project);
                    $mdDialog.hide();
                };
            },
            controllerAs: 'PAmodal',
            templateUrl: 'views/newproject.html',
            targetEvent: e
        })

当我特别单击md datepicker的日历图标来更改日期（一旦update$mdDialog打开）时，问题就出现了

我一直在这个问题上纠缠了一段时间，没有解决办法，希望能对此有所了解。谢谢大家抽出时间

---

---

在添加$mdDateLocaleProvider配置之前，我遇到了与您相同的问题。我一直得到TypeError:date.toLocaleDateString不是函数

我还使用了firebase，能够毫无问题地推动。我甚至可以查看带有保存结果的日期选择器，只有在ref.update上我才会得到错误。我花了相当多的时间寻找这个bug，最终发现angular material两次通过它的日期函数运行我的日期，这是因为angular的摘要循环，第二次是使用js日期对象的字符串表示，而不是日期对象本身。（因此TypeError:date.toLocaleDateString不是一个函数，因为它将date视为字符串而不是日期对象。）

不幸的是，我无法在我的实际应用程序中找到修复程序，因此我必须进入angular-material.js源代码，在错误发生之前，我获取传入的日期，并确保将其转换为日期（d=新日期（d））

---

这对我来说很有效，因为它总是一个日期或日期的toString-无论哪种方式，它都确保它是一个实际的日期对象。

下面的代码保留在问题中

app.config(function($mdDateLocaleProvider) {
$mdDateLocaleProvider.formatDate = function(date) {
   return moment(date).format('L');
};});

这将消除“TypeError:date.toLocaleDateString不是函数”错误

自始至终，我只对这个时代感兴趣。 我没有意识到md datepicker只喜欢日期对象。这解释了为什么我无法更新project.deadline，因为它正在读取大纪元时间。它可以很好地看到它，但更改它会导致错误，因为它无法识别要显示的日期（因此显示1934年…）

相反，我将重点放在只处理日期对象的datepicker上

添加新项目：

• var date是以日期对象形式从md datepicker输入的数据。 然后我将其转换为epoch，以便像其他值一样将其保存到firebase

  var date = new Date(project.deadline);
  project.deadline = date.getTime();
  

更新项目：

• 正在将currentProject分配给vm.project。这使我能够访问vm.project.deadline，其中包括我在epoch time中添加的截止日期。将截止日期从历元时间转换为日期对象。这让我可以随意更改日期。一旦用户单击更新，新的日期对象将首先转换为历元，然后我可以像其他数据一样添加到firebase

  var vm = this;
  vm.project = {};
  vm.project = currentProject;
  
  vm.project.deadline = new Date(vm.project.deadline);
  
  vm.update = function() {
      var date = new Date(vm.project.deadline);
      vm.project.deadline = date.getTime();
      ...
  

---

我需要大纪元，因此需要转换。如果不需要epoch（或其他日期形式），我想保持date对象不变应该没有问题

你可以提供小提琴它将更容易解决yoHi，我有困难让它在JSFIDLE工作。只是没有回应。我将添加我在您的范围内发现的其他内容。目前，我们发现$mdDialog存在一些问题，

单击外部关闭：true

。可能取决于您的范围。尝试将其更改为

false

，看看是否可以使其正常工作！嗨，我试了一下，到现在为止没有什么不同。目前正在做其他事情，并将返回进一步调查。我会记住范围。谢谢你的建议！FWIW，我遇到了这个问题，因为我的init模型的日期不是JavaScript

date

对象（它是

moment.format（）

）。使用

newdate（）。再见，嗨，凯尔！我明白了，我需要读更多关于消化周期的书，但我看到了图片。您是否在CalendarCtrl.prototype.getDateid上第6423行周围的角度材质文件中进行了更改？我尝试在return函数之前添加date=newdate（date），但仍然出现错误。你到底在哪里添加代码的？我想您已经配置了$mdDateLocaleProvider，是否使用了矩？再次感谢您的帮助。我的错误是在DateLocaleProvider.prototype上触发的。大约7157美元。然而，这仍然是相同的一般想法，该日期不被视为日期对象。因此，如果date=new date（日期）未生成有效的日期对象，则仍然会出现该错误的唯一方法是，这意味着“date”不能是有效的日期对象或有效的日期字符串-在输入date=new date（日期）之前，是否可以登录或输入断点以查看date的值？嘿，Kyle！谢谢你的帮助！我终于看了一眼。根据你的建议，我成功了。我不需要更改源代码中的任何内容。我会把它贴在答案里。
app.config(function($mdDateLocaleProvider) {
$mdDateLocaleProvider.formatDate = function(date) {
   return moment(date).format('L');
};});

var date = new Date(project.deadline);
project.deadline = date.getTime();

var vm = this;
vm.project = {};
vm.project = currentProject;

vm.project.deadline = new Date(vm.project.deadline);

vm.update = function() {
    var date = new Date(vm.project.deadline);
    vm.project.deadline = date.getTime();
    ...