html - 输入复位时刷新 Angular 输出

Question

我<input>在一个<form>. Angular 从这些字段中获取值，而不管<form>（实际上只有 Bootstrap 将正确的样式应用于内部字段）。

现在，我希望能够重置这些字段，并让 Angular 更新与它们关联的输出。但是，常规<input type="reset"/>按钮不起作用。它会重置所有<input>字段的值，但 Angular 不会刷新基于其后字段的输出。

有没有办法告诉 Angular 根据字段的当前状态刷新输出？像一个ng-click="refresh()"？

Answer 1

假设您的模型名为address. 你有这个 HTML 表单。

<input [...] ng-model="address.name" />
<input [...] ng-model="address.street" />
<input [...] ng-model="address.postalCode" />
<input [...] ng-model="address.town" />
<input [...] ng-model="address.country" />

你的角度控制器中有这个。

$scope.reset = function() {
    $scope.defaultAddress = {};
    $scope.resetAddress = function() {
        $scope.address = angular.copy($scope.defaultAddress);
    }
};

JSFiddle在这里可用。

Answer 2

您应该将您的价值观与模型联系起来。

<input ng-model="myvalue">

输出：{{myvalue}}

$scope.refresh = function(){
   delete $scope.myvalue;
}

JSFiddle：http: //jsfiddle.net/V2LAv/

另请查看此处的示例用法：http $pristine: //plnkr.co/edit/815Bml ?p=preview