输入文本值的离子点火事件发生变化

Question

在Ionic中，当文本输入字段的值发生变化时，如何在文本输入字段上捕获事件？

输入字段：

<input type="search" placeholder="Search" ng-text-change="searchMenu()">

控制器：

// ...
    $scope.searchMenu = function () {
        alert('changed')
        console.log(1);
    };
// ...

在文本字段中输入时没有任何反应。

Answer 1

Ionic是一个简单的角度，角度有两种观察变化的一般方式：

1. 使用$scope.$watch：

标记：

 <input type="search" placeholder="Search" ng-model="search" />

和代码：

  $scope.$watch('search',function (oldValue, newValue) {
     alert('changed')
     console.log(1)
  });

为了完整起见，还有$watchGroup和$watchCollection

1. 使用ng-change指令与ng-model：
一起使用

标记：

 <input type="search" placeholder="Search" 
        ng-model="search" 
        ng-change="onSearchChange()" />

和代码：

 $scope.onSearchChange = function () {
    alert('changed')
    console.log(1)
}

还有一些获得更改的高级方法，例如创建与ngModel指令控制器通信的指令和/或创建自定义格式化程序和解析器以使用ng-model。

Answer 2

您需要添加ng-model属性并使用ng-change代替ng-text-change。

ng-change是一个内置的角度指令，可在绑定模型（ng-model）发生变化时触发事件。 ngChange documenation

所以你的HTML会是这样的：

<input ng-model="inputValue" ng-change="searchMenu" type="search" placeholder="Search">

在你的控制器中，你需要添加一个$ scope变量，如：

$scope.inputValue = ''

Answer 3

ng-change 而非 ng-text-change ，您必须在该输入元素上包含 ng-model 触发ng-change事件

docs