通过用户输入更改输入编号不起作用

Question

现在我有一个输入框：

<input type="number" ng-model="distance"></input>

在 JS 中，我将距离分配给一个值：

$scope.distance = 0;

我希望在用户输入值并单击按钮时更改此值。我用我的控制器设置了按钮...但是每次单击按钮时，它显示的值为 0。

点击按钮时的函数：

//convert button function for when button is clicked
$scope.convert = function(myUnit, myUnit2, distance){
    alert(distance);
}

按钮：

<button class="button button-block button-balanced" ng-click="convert(myUnit.thisunit, myUnit2.thisunit2, {{distance}})">
    Convert
</button>

Answer 1

根据您的 HTML 的结构，（如果您的 <input> 上方有一个 ngIf），距离模型可能不会滴到你的控制器。

为了安全起见，您可能应该嵌套它，如下所示：

$scope.formData = {distance: 0};

然后：

<input type="number" ng-model="formData.distance"></input>

此外，您的点击处理程序也应该只读取 $scope 值：

$scope.clickHandler = function() {
    alert(formData.distance);
}

Answer 2

将 ng-click 更改为此 ng-click="convert(myUnit.thisunit, myUnit2.thisunit2, distance)"，因为您在 ng-click 指令中使用了 {{distance}} 插值指令，该指令永远不会传递距离值

HTML

<button class="button button-block button-balanced" ng-click="convert(myUnit.thisunit, myUnit2.thisunit2, distance)">
    Convert
</button>

希望对您有所帮助，谢谢。

change input number by user input not working