Estoy luchando con la lógica ng-show y $invalid, mi requisito es muy simple. Necesito hacer un formulario que muestre los campos de entrada según las condiciones.

Necesito agregar un selector de fecha y hora de moment.js.

El problema comienza cuando entiendo que mi selector de fecha y hora no funciona con ng-if porque ng-if elimina el elemento del DOM y mi selector de fecha y hora no puede funcionar con esto, usé ng-show en su lugar y funcionó. Pero el problema es que mi formulario se divide en varios formularios diferentes según las condiciones. Estoy mostrando diferentes entradas y el selector de fecha y hora no está en todas las condiciones.

Esto hace que mi botón de envío se mantenga deshabilitado en esas condiciones cuando no estoy mostrando el selector de fecha y hora.

Intenté pensar mucho en usar ng-switch también, pero me di cuenta de que ng-swith también funciona igual que ng-if, esto nuevamente me causará el mismo problema si el selector de fecha y hora (no funcionará).

Hay alguna manera de resolver esto

Mi estructura de código -

 <div id="mainDiv"> <form id="myForm"> <div ng-show="condition1"> <div ng-if="condition1of1"> // input fields such as text email password </div> <div ng-show="condition2of1"> //date time picker here </div> <div ng-if="condition3of1"> // other input fields </div> </div> <div ng-if="condition2>......</div> <div ng-if="condition3>......</div> <input id="btn" type="submit" ng-disabled="myForm.$invalid" value="Submit" ng-click="submitData()"> // button that will remain disable until all the required fields will not get resolved. </form> </div>

Cómo resolver este problema?