How to change time from 24 to 12 hour format in angular 5
Yes, you can do it from pipe:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({name: 'convertFrom24To12Format'})
export class TimeFormat implements PipeTransform {
transform(time: any): any {
let hour = (time.split(':'))[0]
let min = (time.split(':'))[1]
let part = hour > 12 ? 'pm' : 'am';
min = (min+'').length == 1 ? `0${min}` : min;
hour = hour > 12 ? hour - 12 : hour;
hour = (hour+'').length == 1 ? `0${hour}` : hour;
return `${hour}:${min} ${part}`
}
}
In your html for example:
<p>Time Format From 24 to 12 : {{'23:11:00' | convertFrom24To12Format}}</p>
Hope this will help you!!
With Pipe you can achive it you need to use hh for 12h and HH for 24h
var value = element(by.binding('example.value | date: "HH:mm:ss"'));
var valid = element(by.binding('myForm.input.$valid'));
function setInput(val) {
var scr = "var ipt = document.getElementById('exampleInput'); " +
"ipt.value = '" + val + "';" +
"angular.element(ipt).scope().$apply(function(s) { s.myForm[ipt.name].$setViewValue('" + val + "'); });";
browser.executeScript(scr);
}<script src="//code.angularjs.org/1.7.0/angular.min.js"></script>
<body ng-app="timeExample">
<script>
angular.module('timeExample', [])
.controller('DateController', ['$scope', function($scope) {
$scope.example = {
value: new Date()
};
}]);
</script>
<form name="myForm" ng-controller="DateController as dateCtrl">
<label for="exampleInput">Pick a time and Change AM to PM</label>
<input type="time" id="exampleInput" name="input" ng-model="example.value"
placeholder="HH:mm:ss" required /><br/>
<tt>value in 12H = {{example.value | date: "hh:mm:ss"}}</tt><br/>
<tt>value 24H = {{example.value | date: "HH:mm:ss"}}</tt>
</form>
</body>For future reference, using the default Angular pipe reference UPPERCASE HH.mm instead of hh.mm
today: Date = new Date('2020-12-12T18:00');
<div> {{ today | date : 'hh.mm' }}</div>
// 06.00
<div>{{ today | date : 'HH.mm' }}</div>
// 18.00