AngularJS：在编译表格后开始观察表格变化

Question

我希望观察表格是否为原始格式。我的HTML看起来像这样：

<div ng-if="ObservationCtrl.showHeader"> 
    <form class="form-horizontal" name="ObservationCtrl.observationForm" role="form" ng-if="!ObservationCtrl.doingResolve"> 
    {{ObservationCtrl.observationForm.$pristine}} 
     <!-- SOME HTML --> 
    </form> 
</div> 

在我的控制，我有以下代码：

console.log(self.observationForm); 

    $timeout(function(){ 
      $scope.$watch('self.observationForm', function() { 
       if(self.observationForm) { 
        console.log('form is valid? ', self.observationForm.$pristine); 
       } else { 
        console.log('form is not defined'); 
       } 

      }); 
     },2000); 

这将记录undefined，但不会把戏，因为它开始2秒后看的形式，当它已经存在。但是，如果我将等待时间减少到等于100，甚至是0，那么我会收到form is not defined消息，并且当我更改表单中的某些内容时，无法识别更改。根据一些SO帖子，那是因为我开始在之前观看表格它被编译。

我希望在编译后开始观看表格。依靠一些预定义的超时是棘手的，但我还没有找到任何其他方式来做到这一点。我也试过$evalAsync，但没有运气。

Answer 1

$scope不知道self属性，您应该将其更改为“控制器名称”。另外，你说你看$pristine属性，所以你应该看一个：

$scope.$watch('ObservationCtrl.observationForm.$pristine}', function(val) { 
    console.log("Is pristine:", val); 
}); 

或者，你可以把它改成一个回调函数：

$scope.$watch(function() { 
    return self.observationForm.$pristine; 
}, function(val) { 
    console.log("Is pristine:", val); 
}); 

当然，你可以做检查的形式已经存在，这在你的情况下是因为ng-if指令：

$scope.$watch(function() { 
    if (self.observationForm) { 
     return self.observationForm.$pristine; 
    } 

    return false; 
}, function(val) { 
    console.log("Is pristine:", val); 
});