如何输入时间与AngularFire火力? [英] How to input a time into firebase with AngularFire?

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

问题描述

我希望用户能够通过从输入框中选择一个时间提交一次进入火力数据库。

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

我知道如何有根据<一个用户输入文本火力href=\"https://www.firebase.com/docs/web/libraries/angular/quickstart.html?gclid=CMS5o42wy8gCFc8YHwodlMsL0g\"相对=nofollow>火力文档,但不知道如何在用户可以在时间进入火力点。

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.

当我加上类型=时间的输入框(如下),下面的code可以不再提交输入火力。当它去掉,它会恢复正常。

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

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
    });
  };

});

你如何提交一次进入火力点?

How do you submit a time into firebase?

请参阅我的 codePEN这里

推荐答案

有几件事情在这里发生了:

A few things are going on here:


  • 文本(默认为输入型)将返回一个字符串类型的输入

  • 类型的输入时间将返回一个Date对象

  • 火力地堡存储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

所以,你必须你进入一个支持的类型的时间转换,将它传递给火力地堡之前。

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火力?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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