Как преобразовать тип ввода '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
});
}
});
});
Обратите внимание, что в общем случае числовые даты гораздо более полезны, чем строки (их легче анализировать, сортировать, запрашивать и т. Д.), И в этих примерах используется эта превосходная стратегия хранения. Преобразование этого в строку должно быть самоочевидным.