如何检测Angularjs中的输入字段发生变化

Question

现在我有一个页面供用户输入一些数据，这不是表单。 如：

<input type='text' ng-model='ExpReport.ReportName' /> <input type='text' ng-model='ExpReport.startdate' />

有一个退出按钮让用户回到他们原来的地方。问题是如果用户不更改或修改任何输入。（假设他们只是意外到达这里）当他们点击退出按钮时，他们可以直接返回，但如果他们做了一些更改，如果他们想返回，我需要显示一个弹出窗口来确认他们想要离开而不保存数据。我怎样才能抓住它？

我尝试使用 $watch，但似乎对我不起作用：

angular.forEach($scope.ExpReport,function(value,key){
            $scope.$watch('value',function(oldvalue,newvalue){
                   var currenturl = $location.path();
          if(currenturl.indexOf('editreport')>-1){
           $scope.$on('$locationChangeStart', function( event,next,current) {      
              event.preventDefault();
              $scope.existconfirm = true; 
                if(next.indexOf('editreport')>-1) {
                $scope.existconfirm = false;
              }     
              }); 
             }
            })
        })

Answer 1

为“$locationChangeStart”（如果使用 ui-router，则为“$stateChangeStart”）事件添加一个事件监听器。当它触发时，您可以提示用户确保他们想要丢失所有更改。

$scope.$on('$locationChangeStart', function (event) {
    if(userHasUnsavedChanges() && !confirm('Are you sure you want to abandon your changes?')){
        event.preventDefault();
    }
});