根據var值更改md-input-container輸入類型

Question

我希望md-input-container的輸入類型可以是文本，數字或日期，具體取決於我在範圍中定義的內容的值。

要做到這一點，我創建了3個不同的容器，它們在各處都具有相同的值，但是在type屬性上，並使用ng-show來更改可見的容器，具體取決於我需要的容器。

這部分工作得很好，但是當我寫這個領域的東西它運行3種數據類型的驗證，這表明在控制檯上許多錯誤：

"Error: [ngModel:datefmt] http://errors.angularjs.org/1.3.15/ngModel/datefmt?p0=1 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:6:417 
    at Array. (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:156:270) 
    at Object. (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:228:41) 
    at n.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:123:221) 
    at b.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:293) 
    at eg.$$debounceViewValueCommit (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:227:364) 
    at eg.$setViewValue (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:227:92) 
    at HTMLInputElement.l (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:153:466) 
    at HTMLInputElement.c (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:32:389)" 
"Error: [ngModel:datefmt] http://errors.angularjs.org/1.3.15/ngModel/datefmt?p0=10 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:6:417 
    at Array. (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:156:270) 
    at Object. (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:228:41) 
    at n.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:123:221) 
    at b.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:293) 
    at eg.$$debounceViewValueCommit (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:227:364) 
    at eg.$setViewValue (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:227:92) 
    at HTMLInputElement.l (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:153:466) 
    at HTMLInputElement.c (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:32:389)" 

我想，這是因爲它們都具有同一個模型，但是因爲我會在同一個地方使用這個值，所以我希望這樣做。

Here is a codepen showing the problem.

我怎麼能解決這個問題？

Answer 1

而不是ng-show您可以使用ng-if。

ng-show在dom中創建一個元素，因爲日期輸入無法將數字解析爲一個日期，所以會引發錯誤。

希望這會有所幫助！