2

我实际上不确定问题的标题应该是什么,因为我不清楚我错过了什么。

我把它归结为一个非常简单的例子(实际情况更复杂)。我在 ng-switch 中有一个文本框和按钮。我读过,这个开关创建了它自己的本地范围。

当单击按钮时,我想要将文本框的值传递给函数。在函数中,我将对值做需要做的事情,然后清除文本框。我正在努力寻找正确的方法来做到这一点。

控制器代码:

$scope.temp = 1;

$scope.tempCall = function (tempModel) {
    tempModel = ""; //this doesn't work
    $scope.tempModel = ""; //nor does this
};

HTML/模板:

<div ng-switch on="temp">
    <div ng-switch-when="1">
        <input ng-model="tempModel" />
        <input type="button" ng-click="tempCall(tempModel)" />
    </div>
    <div ng-switch-when="2">TWO</div>
</div>

我相信我实际上可以从父范围或根范围遍历范围并清除值,但这并不“感觉”正确。清除此值的正确(Angular)方法是什么?

4

2 回答 2

3

当您在角度范围内使用原始值时,您不能从子范围覆盖父范围中的值。这是因为 Angular 使用 javascript 原型继承。

在这种情况下,您可以做的是在父范围内创建一个对象,然后您可以在子范围内更新该对象的值。因为您没有覆盖对象(仅附加到它的属性),所以引用有效。

我在 plunk 上创建了一个演示,你可以在这里查看

$scope.temp = 1;
$scope.tempModel = {};

$scope.tempCall = function () {
  $scope.tempModel.previous = $scope.tempModel.value
  $scope.tempModel.value = "";
};

<div ng-switch on="temp">
  <div ng-switch-when="1">
      <input ng-model="tempModel.value" />
      <input type="button" ng-click="tempCall()" />
      {{tempModel.previous}}
  </div>
  <div ng-switch-when="2">TWO</div>

于 2013-06-13T14:09:38.370 回答
1

这是一种方法:

<input type="button" ng-click="tempCall(tempModel);tempModel='';" />

可能更“有角度的方式”是在模型中使用一个点,例如:

<input type="text" ng-model="tempModel.value" />

然后通过传递tempModel对象来调用您的函数,例如:

<input type="button" ng-click="tempCall(tempModel)" />

然后您将能够通过以下方式清除该值:

$scope.tempCall = function (tempModel) {
    tempModel.value = "";
};

这是一个小提琴

为了防止数据绑定问题,“经验法则是,如果您使用 ng-model,则某处必须有一个点。” 米什科·赫弗里

于 2013-06-13T14:05:04.547 回答