eonasdan datetimepicker，在頁面加載時觸發更改事件

Question

我試圖將ng-change添加到運行datetimepicker的輸入中，但它會在頁面加載時觸發change函數。 下面是代碼

<input datetimepicker ng-model="startDate" 
       ng-change="testFunction()" 
       options="cOptions" 
       placeholder="Select Date"/>

任何想法如何防止這種情況？

編輯：

$scope.testFunction = testFunction;
function testFunction(){
    console.log('on change')
}

loadData();

function loadData(){
  //this is where startDate is set
}

Answer 1

嗨，您在其中使用指令的輸入字段中的更改是由插件觸發的，它明確將其設置為null。 因此，您可以進行驗證，直到填充的輸入字段不執行您在ng-change函數上編寫的邏輯。 有兩種方法可以做到這一點：

<div class="input-group">
    <input class="form-control" datetimepicker ng-model="vm.date" options="vm.options" 
    ng-change="vm.date && vm.changed()"/>
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar">
    </span></span>
</div>

現在，直到您在字段中插入內容，ng-change才會觸發。 因此onload不會觸發。 其他方法類似於用ng-change函數代替此范圍變量，您可以在該函數中檢查值是否為null。 如果非null，則僅運行在ng-change上編寫的實現。

這是顯示這兩種情況的工具： http ://plnkr.co/edit/uCf2vpmoYIYzxTjmFVcX?p=preview

更新：如果您正在編輯值加載，但仍然不想執行在ng-change上編寫的實現，那么將有一個單獨的變量，請在第一個ng-change上切換其值，該值會由於指令而自動觸發，接下來的更改將繼續ng-change功能將運行。 http://plnkr.co/edit/FogYzmDBd1gIolvjP7yl?p=preview