Как преобразовать тип ввода 'time' в строку при использовании ng-change в AngularJS?

Я хотел бы преобразовать ввод времени в строку или отметку времени, чтобы она поддерживалась Firebase.

Например, следующий код не будет работать, потому что ввод имеет тип времени.

HTML

<html ng-app='app'>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
    <script src="https://cdn.firebase.com/js/client/2.0.2/firebase.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script>
</head>
<body ng-controller="ctrl">
      <input ng-change="data.$save()"  ng-model="data.text">
       {{data.text}}
      <br>
        <input type='time' ng-change="data.$save()"  ng-model="data.time"></input>
      {{data.time}}
</body>

AngularJS

var app = angular.module("app", ["firebase"]);
app.controller("ctrl", ["$scope","$firebase", function($scope,$firebase)                                      
    {
      var ref = new Firebase('https://welcome.firebaseIO.com/Data/RandomUser');
        $scope.data = $firebase(ref).$asObject();
    }]);

Смотрите codpen здесь.

Я попытался преобразовать ввод времени со следующим безуспешно:

Попытка добавления.toString() в конце data.time

<input type='time' ng-change="data.$save()"  ng-model="data.time.toString()">

Попытка добавления.toString() в конце данных.$ Save()

<input type='time' ng-change="data.$save().toString()"  ng-model="data.time">

Я также посмотрел документацию ng-change, в которой говорится, что выражение вычисляется немедленно, поэтому, возможно, это невозможно с помощью ng-change.

1 ответ

Решение

В качестве примера в документации AngularFire API приводится манипулирование датами (поиск "Для иллюстрации давайте создадим фабрику, которая создает экземпляры Widget и преобразует даты:") и, как тема, манипулирование данными рассматривается в разделе, посвященном расширению сервисов., Есть также скрипка, демонстрирующая манипуляции с датой.

Вот пример из скрипки:

/**
 * Add a factory object which parses dates
 */
app.factory('DateFactory', function ($firebaseObject) {
    return $firebaseObject.$extend({
        /**
         * Called each time there is an update from the server
         * to update our data
         */
        $$updated: function (snap) {
            // call the super
            var changed = $firebaseObject.prototype
                .$$updated.apply(this, arguments);
            // manipulate the date
            if( changed ) {
               this.date = new Date(this.date||0);
            }
            // inform the sync manager that it changed
            return changed;
        },

        /**
         * Used when our data is saved back to the server
         * to convert our dates back to JSON
         */
        toJSON: function() {
            return angular.extend({}, this, {
                // revert Date objects to json data
                date: this.date? this.date.getTime() : null
            });
        }
    });
});

Обратите внимание, что в общем случае числовые даты гораздо более полезны, чем строки (их легче анализировать, сортировать, запрашивать и т. Д.), И в этих примерах используется эта превосходная стратегия хранения. Преобразование этого в строку должно быть самоочевидным.

Другие вопросы по тегам