如何检测输入字段在Angularjs中更改

现在我有一个页面供用户输入一些数据，这不是表单。如：如何检测输入字段在Angularjs中更改

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

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

我尝试使用$手表，但是好像对我不起作用：

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; 
       }  
       }); 
      } 
      }) 
     })

来源

2015-04-29 linyuanxie

https://docs.angularjs.org/api/ng/directive/ngChange？ – Ronnie

这是不是很清楚你在这里试图做什么。您列出了一对绑定到“ExpReport”属性的输入框，以及一段代码角度代码，它提示范围中可能有多个“ExpReport”，您似乎正在观看其中的每一个属性，名为“value” “这甚至不是输入框之一。 – Claies

我认为这个问题已经在这里找到答案。

Detect unsaved data using angularjs

来源

2015-04-29 22:59:58 Scott

该答案链接到这个答案：http://stackoverflow.com/questions/14852802/detect-unsaved-changes-and-alert-user-using-angularjs –

链接到另一个答案的意图是显示使用肮脏的国旗以及如何使用，而不是用勺子给用户提供罐装答案。给一个男人一条鱼，你喂他一天，教一个男人去钓鱼，你给他的生命 – Scott

（如果使用的用户界面的路由器或 '$ stateChangeStart'）事件添加事件侦听到 '$ locationChangeStart'。当它发生火灾时，你可以提示用户确保他们想要失去所有的改变。

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

来源

2015-04-29 23:01:34 HankScorpio

虽然这可能有效，但它并没有真正回答问题，因为在问题中没有迹象表明海报甚至使用'$ stateChangeStart'所属的'ui-router'插件。 – Claies

已更新。更好？ – HankScorpio

我认为这正是问题作者需要做的事情：保留旧数据的副本，然后根据@HankScorpio建议的路线更改检查新的表单数据。 –

如何检测输入字段在Angularjs中更改

回答

相关问题