Question

我有一个<input>，显示一个数字。我使用ng-model将此数字绑定到变量。我的问题是我不希望变量只是简单地改变输入，我希望它在按钮点击时改变，但我也希望输入中显示的默认值是存储在变量中的默认值。

使其更清晰：

<input type="number" ng-model="foo">
<button ng-click="updateFoo()">Update foo</button>
{{foo}}

我希望foo仅在按下按钮时反映更改，但如果我刷新页面，{{foo}}将显示一些值（存在检索值的逻辑）。

我目前的方式，在我的AngularJS控制器中：

$scope.foo = 5;

$scope.updateFoo = function(num){
  $scope.foo = num;
}

和HTML：

<input type="number" ng-model="not_in_controller">
<button ng-click="updateFoo(not_in_controller)">Update foo</button>
{{foo}}

这是我想要的，但输入默认是空的。

另一个想法是使用两个变量，一个用于演示，另一个在点击按钮后设置

Answer 1

只需使用ng-init指令：

<input type="number" ng-model="not_in_controller" ng-init="not_in_controller=5">
<button ng-click="updateFoo(not_in_controller)">Update foo</button>
{{not_in_controller}}

Answer 2

只需在value="{{ foo }}"

中使用<input />即可

这里有一个jsfiddle：http://jsfiddle.net/5s3cjyuw/

使ng-model不会自动更新值

2 个答案: