獲取輸入元素的顯示文本

Question

我的網站使用的是Angular Material，它正在更改在我的type ='time'輸入字段中輸入的文本格式。 我希望能夠針對此文本進行斷言，但是我找不到能找到它的方法來提供顯示的實際文本。

我嘗試了以下元素屬性：value，valueAsDate，textContent，innerHTML。

我還嘗試了jqlite的val（）方法。

這是一個演示我的問題的Codepen： https ://codepen.io/carlins/pen/JJNJab

//displayed text is 02:57 PM
document.querySelector('input').value         // 14:57:00.000
document.querySelector('input').valueAsDate   // 1970-01-01T14:57:00.000Z
document.querySelector('input').textContent   // empty
document.querySelector('input').innerHTML     // empty
angular.element(document).find('input').val() // 14:57:00.000

Answer 1

您不應該從Element那里獲取數據，而只能處理數據，如果您需要在視圖中顯示數據，可以使用{{time | date:'h:mm a'}} {{time | date:'h:mm a'}}如果您需要在Javascript中獲取價值，只需使用帶time變量的dateformat即可。

Answer 2

您的輸入有一個datetime值，因此當您想獲取輸入值時會得到datetime。 在angular中，您可以根據需要使用日期過濾器獲取日期字符串。 我在這里嘗試過作品

日期過濾器參考： https : //docs.angularjs.org/api/ng/filter/date

$scope.timeInnerHTML = function(){
      return $scope.time;
 }

"{{timeInnerHTML() | date:'@h:mma'}}"