可以使用函数代替 ng 模型选项的事件

Question

假设我有一些与以下角度关联的输入标签：

<input type="text" data-ng-model-options="{ updateOn: 'submit' }" data-ng-model='value.name'>

提交带有此标记的表单时，它将更新值的名称。

有没有办法在调用控制器定义的函数而不是事件时触发updateOn？还是 API 只能处理浏览器事件？

例如：

如果我有这样的东西：

angular.module('someModule')
  .controller('someCtrl', ["$scope", Callback])
function Callback($scope){
  $scope.updateValue = updateValue
  function updateValue(){
    console.log('will now update value')
  }
}

有没有办法只在调用updateValue函数时更新模型？

这行不通，但是像这样的事情？

<input type="text" data-ng-model-options="{ updateOn: 'updateValue' }" data-ng-model='value.name'>

Answer 1

不能将自定义函数传递到 ng-model-options 指令的 updateOn 属性中，但是，可以控制何时将内容推送到模型，如下所示：

angular.module('someModule', [])
  .controller('someCtrl', ["$scope", Callback])
function Callback($scope){
  $scope.updateValue = updateValue
  $scope.value = {
    name: ""
  }
  function updateValue(form){
    console.log('will now update value')
    // form.[prop] matches name="prop" attribute on form input
    form.name.$commitViewValue();
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<div data-ng-app="someModule" data-ng-controller="someCtrl">
  <form name="myForm">
    <input type="text" name="name"
           data-ng-model-options="{ updateOn: 'submit' }" data-ng-model='value.name'>
    {{value.name}}<br/>
    <button data-ng-click="updateValue(myForm)">Update Name</button>
  </form>
</div>