的Javascript AngularJs（NG1）如果NG-模型值爲null

Question

我使用的一個項目AngularJs（Angular1），我有一個NG-模型，得到一個值：

<input id="myinput" type="text" class="form-control" ng-model="ctrl.myDate" ng-required="true" /> 

這工作得很好，只要ctrl.myDate不爲null當它爲零時打破代碼

有沒有一種方法可以檢查值是否爲空並添加（例如）今天的日期如果它爲空，那麼它不會中斷？

我該怎麼做？

Answer 1

<input ng-if="ctrl.myDate" id="myinput" type="text" class="form-control" ng- 
    model="ctrl.myDate" ng-required="true" /> 
<!-- default date when myDate is null --> 
<input ng-if="!ctrl.myDate" id="myinput" type="text" class="form-control" ng- 
    model="ctrl.defaultDate" ng-required="true" /> 

您可以在$ scope.ctrl中存儲defaultDate。

Answer 2

1）假設ctrl.myDate爲空，那麼它可能是初始化在你的控制器的某個地方。基於此，替換模型值的正確位置是您的控制器，而不是視圖。

因此，在這種情況下，你的代碼可能是這個樣子：

function setDate() { 
    const today = new Date(); 
    vm.myDate = getDate() || today; // If date is null then assign today. 
    } 

    function getDate() { //This might be an http call that brings the date. 
    return null; 
    } 

2）另一方面，如果你的模型只是用於演示目的，你可以做使用ng-value指令，這樣的事情，但有可能沒有理由使用input標籤。

<input id="myinput" type="text" class="form-control" ng-value="ctrl.myDate || ctrl.today" ng-required="true" /> 

這是working sample based on your question。

Answer 3

您可以將條件移至控制器初始化的位置，而不是在ng模型中？例如NG-INIT？

var myApp = angular.module('myApp',[]); 
myApp.controller('TestController', ['$scope', function($scope) { 
    var testController = this; 

    testController.init = function (dateInput) { 
    if (dateInput !== null) { 
     testController.myDate = dateInput !== null ? dateInput : getDate(); 
    } 
    };  
}]); 

和

<div ng-controller="TestController as ctrl" ng-init="ctrl.init(yourDate)"> 
    <input id="myinput" type="text" class="form-control" ng-model="ctrl.myDate" ng-required="true" /> 
</div>