如何使用 AngularFire 将时间输入到 firebase 中? [英] How to input a time into firebase with AngularFire?

查看:19
本文介绍了如何使用 AngularFire 将时间输入到 firebase 中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望用户能够通过从输入框中选择时间来将时间提交到 firebase 数据库中.

I'd like a user to be able to submit a time into the firebase database by selecting a time from the input box.

我知道如何让用户根据 firebase 文档,但不是用户如何在一段时间内输入 firebase.

I know how to have the user enter text into firebase based on the firebase documentation, but not how the user can enter in a time into firebase.

当我在输入框(如下)中添加type="time"'时,下面的代码不能再向firebase提交输入.当它被删除时,它会恢复正常.

When I add "type="time"' to the input box (as below), the below code can no longer submit input to firebase. When it's removed, it goes back to normal.

HTML

<html ng-app="sampleApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/1.1.3/angularfire.min.js"></script>
  </head>

  <body ng-controller="SampleCtrl">
    <ul>
      <li ng-repeat="message in messages">
        <input ng-model="message.text" ng-change="messages.$save(message)" />

        <button ng-click="messages.$remove(message)">Delete Message</button>
      </li>
    </ul>
    <form ng-submit="addMessage()">
      <input type="time" ng-model="newMessageText" />
      <button type="submit">Add Time</button>
    </form>
  </body>
</html>

AngularJS

var app = angular.module("sampleApp", ["firebase"]);

app.controller("SampleCtrl", function($scope, $firebaseArray) {
  var ref = new Firebase("https://frontier.firebaseio.com/messages");
  $scope.messages = $firebaseArray(ref);

  $scope.addMessage = function() {
    $scope.messages.$add({
      text: $scope.newMessageText
    });
  };

});

您如何将时间提交到 Firebase?

How do you submit a time into firebase?

在这里查看我的codepen

推荐答案

这里发生了一些事情:

  • text 类型的输入(输入的默认类型)将返回一个字符串
  • time 类型的输入将返回一个 Date 对象
  • Firebase 存储 JSON 数据
  • Date 对象没有 JSON 数据类型
  • An input of type text (the default type for an input) will return a string
  • An input of type time will return a Date object
  • Firebase stores JSON data
  • There is no JSON data type for Date objects

因此,您必须先将获得的时间转换为受支持的类型,然后再将其传递给 Firebase.

So you will have to convert the time you get into a supported type, before passing it to Firebase.

$scope.addMessage = function() {
  $scope.messages.$add({
    text: $scope.newMessageText.toString()
  });
};

请注意,如果您只想显示日期,则将日期存储为字符串非常有用.但是,如果您还想对其进行操作(例如根据日期进行过滤),您可能希望将其存储为时间戳:

Note that storing a date as a string is great if you want to only display the date. But if you want to also manipulate it (e.g. filter based on the date), you will probably want to store it as a timestamp:

$scope.addMessage = function() {
  $scope.messages.$add({
    text: $scope.newMessageText.toString(),
    timestamp: $scope.newMessageText.getTime(),
  });
};

这篇关于如何使用 AngularFire 将时间输入到 firebase 中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆