Question

我是Angular的新手，并试图在离子中构建一个应用程序。我在屏幕上有2个字段，我想实现以下内容。

当用户在private void initLabel(){ this.setFont(new Font("Arial", 25)); this.setOnMouseClicked(e -> choseListener.onChosed(getText()) ); }字段中输入内容时，我想相应地更新price字段。
当用户在weight字段中输入内容时，我想更新weight字段。

这是我的代码。

price

在我的控制器中我有这些方法：

    <div class="col col-50">
        <div class="card">
            <label class="item item-input">
                <input ng-model="sale_item_weight" value="{{ sale_item_weight }}" ng-change="syncWithItemPrice()" type="number" placeholder="Enter Weight">
            </label>
        </div>
    </div>
    <div class="col col-50">
        <div class="card">
            <label class="item item-input">
                <input ng-model="sale_item_price" value="{{ sale_item_price }}" ng-change="syncWithItemWeight()" type="number" placeholder="Enter Price">
            </label>
        </div>
    </div>

当我更改一个字段时，另一个字段不会更新。函数被调用，我通过向它们添加$scope.syncWithItemWeight = function() { var itemPrice = $scope.sale_item_price; $scope.sale_item_weight = parseInt(itemPrice) * 2; } $scope.syncWithItemPrice = function() { var itemWeight = $scope.sale_item_weight; $scope.sale_item_price = parseInt(itemWeight) / 2; }来确保这一点。

Answer 1

创建一个json对象，而不是直接使用范围变量。

使用以下代码。

HTML

<div class="col col-50">
    <div class="card">
        <label class="item item-input">
            <input ng-model="sale_item.sale_item_weight" value="{{ sale_item.sale_item_weight }}" ng-change="syncWithItemPrice()" type="number" placeholder="Enter Weight">
        </label>
    </div>
</div>
<div class="col col-50">
    <div class="card">
        <label class="item item-input">
            <input ng-model="sale_item.sale_item_price" value="{{ sale_item.sale_item_price }}" ng-change="syncWithItemWeight()" type="number" placeholder="Enter Price">
        </label>
    </div>
</div>

JS

$scope.sale_item = {};

$scope.syncWithItemWeight = function() {
  var itemPrice = $scope.sale_item.sale_item_price;
  $scope.sale_item.sale_item_weight = parseInt(itemPrice) * 2;
}

$scope.syncWithItemPrice = function() {
    var itemWeight = $scope.sale_item.sale_item_weight;
    $scope.sale_item.sale_item_price = parseInt(itemWeight) / 2;
}

角度离子数据绑定问题

1 个答案: