在不使用表单的情况下检查ngModel的$ pristine状态 [英] Check $pristine status of ngModel without using a form

问题描述

我试图弄清楚如何在不使用表单标签的情况下检查ngModel的状态.我没有包装只是ngModel的基本输入元素.

Am trying to figure out how to check the state of a ngModel without using a form tag. I don't have wrappers is just basic input element with a ngModel.

到目前为止，我发现的所有示例都是用于表单验证的，在这种情况下，没有表单.

All the examples I have found so far are for form validations and in this case, there is no form.

当我尝试类似的事情时:

When i tried something like:

HTML

<input type="text" ng-model="lastname">

脚本:

if($scope.lastname.$dirty) {
  console.log('last name has changed');
}

我不确定.

是否可以在不向其添加监视指令的情况下检查ngModel的状态?看来这是框架的一部分，是基本的东西.为什么这行不通?

Is there a way to check the state of the ngModel without adding a watch directive to it? it seems it would be something basic that is part of the framework. Why wouldn't this work?

推荐答案

有两种方法:

<span ng-form="myForm">
  <input type="text" name="name" ng-model="name" required/>
</span>

现在，您可以在控制器的$scope.myForm.name或视图中的myForm.name处访问模型:

Now you can access the model either at $scope.myForm.namein your controller or with myForm.name in your view:

var isPristine = $scope.myForm.name.$pristine;

2.使用angular.element().controller('ngModel')(不要这样做，不好，不好，不好)

或者，您可以绕开它.但这将是丑陋的，无法测试的和总的:

2. Use angular.element().controller('ngModel') (Don't do this one, bad bad bad)

Alternatively, you could hack your way around it. But this is going to be ugly, untestable, and gross:

var elem = angular.element(document.getElementById('myElement'));
var model = elem.controller('ngModel');
var isPristine = model.$pristine;

---

您在中继器中的情况(根据您的评论)

我的示例和您的示例之间的唯一区别是，输入字段位于ng-repeater内部.认为那没关系，但我想确实如此.

the only difference between my example and your is that the input field is inside a ng-repeater. Thought that wouldn't matter but I guess it does.

现在是时候问自己在做什么以及为什么要这么做了……您仍然可以使用ng-form来获取所需的信息，但是您将需要做一些我不会做的疯狂的事情推荐:

And now it's time to ask yourself what you're doing and why... You can still get the information you need using ng-form, but you'll need to do some crazy stuff I wouldn't recommend:

<div ng-repeater="item in items track by $index">
  <span ng-form="rptrForm">
    <input type="text" name="name" ng-model="item.name" required/>
  </span>
</div>

..开始疯狂:

// get the first child scope (from the repeater)
var child = $scope.$$childHead;
while(child) {
  var isPristine = child.rptrForm.$pristine;
  var item = child.item;
  if(!isPristine) {
    // do something with item
  }
  child = child.$$nextSibling;
}

可能是时候重新考虑您的策略了

我不确定您的最终目标是什么，但是您可能想重新考虑一下它的发展方向和原因.为什么需要在控制器中以编程方式访问$ pristine?有哪些替代方案?等等.

It's probably time to rethink your strategy

I'm not sure what your end goal is, but you might want to rethink how you're going about it and why. Why do you need programmatic access to $pristine in your controller? What alternatives are there? Etc.

我想尝试利用ng-change事件并在我的直放站中更新我项目上的一些标志，然后将ng-form内容留待验证:

I, for one, would try to leverage an ng-change event and update some flag on my item in my repeater, and leave the ng-form stuff for validation:

<div ng-repeat="item in items track by $index" ng-form="rptrForm">
   <input type="text" name="name" ng-model="item.name" ng-change="item.nameChanged = true" required/>
   <span ng-show="rptrForm.name.$error.required>Required</span>
</div>

这篇关于在不使用表单的情况下检查ngModel的$ pristine状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！