angularjs ngModel 的范围未按预期工作

angularjs scope for ngModel is not working as expected

我在 angularjs 和 ionic-framework 中创建了自定义指令下拉列表。在我的下拉列表中,项目将在模态弹出窗口中打开,效果非常好。

但我保留了带有清除按钮输入框的搜索输入框,该输入框与 ng-model='search' 一起使用,如果我输入 ng-click="search=''" 按钮 ng-click 会很好用,但如果我放置函数并尝试从指令模块中删除它不会起作用

在模板中

<input type="search" ng-model="search" placeholder="select city...">
<button ng-show="search.length" ng-click="clearSearch()" class="customIcon button button-icon ion-close-circled input-button"></button>

在指令模块中

$scope.clearSearch = function() {
    $scope.search = '';
}

然后它会给我错误

$scope.search is undefined

我对 $scope 的东西很困惑我也想知道我怎么知道任何工具或东西的范围

我还有另一个问题,我将两个自定义指令保持在同一位置,当第一个控件更改其值时,我想清除第二个指令中的选择,因为我也在做 $watch 但我不明白如何我可以做

我的笨蛋 http://plnkr.co/edit/GxM78QRwSjTrsX1SCxF7?p=preview

我没有使用 Ionic 的经验,但这些类型的问题通常与原型继承在 JS 和 AngularJS 中的工作方式有关。

有关 Angular 的原型继承的很好的解释可以在 here.

中找到

这个问题通常可以通过将 属性 移动到对象中来解决:

$scope.viewModel = {};

$scope.clearSearch = function() {
  $scope.viewModel.search = '';
};

然后在你需要的HTML中使用viewModel.search

<input type="search" ng-model="viewModel.search" placeholder="select city...">

演示: http://plnkr.co/edit/4SLfA1CjRWB1XazIhj9d?p=info