Question

<div class="info-block" ng-app="">
                            <div ng-controller="Note">
                            <div class="checkbox">
                                <label>
                                    <p><b>Primary Publication: </b>
                                    {{ form_widget(form.input_ppubs, { 'attr': {'class': 'valOption'}}) }}

                                    </p>
                                </label>
                            </div>

                                <div ng-repeat="item in items">
                                    <input type="text" placeholder="new input" ng-model="item.primaryPub">
                                  </div> 
                                 <button type="button" ng-click="add()">New Item</button>
                            </div>

我正在尝试检索html输入字段的值，并在单击按钮时将其从输入中删除

我可以获取代码，但我不知道如何删除代码。

 var Note = function($scope){
            $scope.items = [];

        $scope.add = function () {


          //angular way of implementing document.getElementByID();
          pub1 = angular.element('#form_input_ppubs').val();



          $scope.items.push({ 
            primaryPub: pub1

          });
        };
      }

Answer 1

您不必像这样检索您的商品。它很丑陋而不是棱角分明的方式。 angular.element('#form_input_ppubs').val();

相反，只需使用ngModel在输入中引用它。

在您的范围内声明它。

$scope.inputItem = null;

<强> HTML

<input ng-model="inputItem " />

在您的函数中使用它：

$scope.addItem = function(item) {
    $scope.items.push(item);

    //reset the model
    $scope.inputItem = null;
}

使用ng-click

进行调用

<button type="button" ng-click="addItem(inputItem)">Add Item</button>

Answer 2

如果你这样做：

console.log($scope.items);

您应该看到primaryPub的条目，即您输入的模型。然后你可以通过归零模型来定位它，所以：

$scope.items.primaryPub = null;

但是你在ng-repeat中使用它：

<div ng-repeat="(i, item) in items">
  <input type="text" placeholder="new input" ng-model="items[i].primaryPub">
</div>

所以你的console.log（如果'items'中有多个项目）应该为primaryPub显示类似数组的结构。

如何使用angularjs删除输入字段的值

2 个答案: