在不使用表单的情况下检查ngModel的$ pristine状态

Question

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

到目前为止我找到的所有例子都是用于表格验证,在这种情况下,没有任何形式.

当我尝试类似的东西:

HTML

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

脚本:

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

我得到了不确定.

有没有办法检查ngModel的状态而不向它添加watch指令？它似乎是基本的东西,是框架的一部分.为什么这不起作用？

Answer 1

有两种方法:

1.使用ng-form:

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

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

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

2.使用angular.element().controller('ngModel')(不要做这个,坏坏坏)

或者,你可以破解它的方式.但这将是丑陋的,不可测试的,粗暴的:

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

编辑:您在转发器内的情况(根据您的评论)

我的例子和你的唯一区别是输入字段在ng-repeater中.认为这无关紧要,但我猜它确实如此.

现在是时候问问自己你在做什么以及为什么......你仍然可以获得你需要的信息ng-form,但你需要做一些我不建议的疯狂的事情:

<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？有什么替代品？等等.

举个ng-change例子,我会尝试利用一个事件并在我的中继器中更新我的项目上的一些标志,并留下ng-form的东西进行验证:

<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>

Answer 2

如果为<form>元素指定name属性,则将作为属性<form>添加到$scope对象中.
然后将现场控制器连接到该form物业.

尽管看起来很奇怪,但你必须定义一个form带有如下name属性的封闭:

<form name="myForm">
  <input type="text" name="lastName" ng-model="lastname">
</form>

并致电酒店:

$scope.myForm.lastname.$dirty

实际上,ngModelController(字段)附在ngFormController(表格)上.