【问题标题】:Remove unchecked value from an array angular js从数组角度js中删除未经检查的值
【发布时间】:2017-07-20 06:48:39
【问题描述】:

我是 Angular js 的新手。我有一个带表格的复选框。

<td><input type="checkbox" ng-if="report.attributes.message.length > 0" ng-bind="report.attributes.message" ng-click="getcheckedData(report.attributes.message)">{{ report.attributes.message }}</td>

这里,我有一个方法getcheckedData()。所以,在那个方法中

   var messages = [];

   $scope.getcheckedData = function(SelectedVal) {     
       $("input:checkbox[type=checkbox]:checked").each(function() {
          if ($.inArray(SelectedVal , messages) === -1){
                messages.push(SelectedVal);
           }
        });
         return messages;
  };

我有一个全局声明的数组。所以,我想将选中的复选框表数据的值放入该数组。我能够在array 中获得该值。因此,当用户取消选中时,未选中的值也应该从 array 中删除。因此,当用户检查 then 时, 我已经给了一个按钮,我将所有检查的消息发送到后端。 因此,当我取消选中并按下按钮时,所有消息仍保留在数组中。

    $scope.sendAllMessages = function() {      
      uploadService.SendMessagesToQueue(uploadService.currentFileName,$scope.documentType,messages)
     .then(function () {
        }, function (error) {
         $scope.errorMessage = error.status + " : " + error.statusText;
         toastr.error($scope.errorMessage, 'Error : ' + error.status);
         if (error.status === 401) {
             loginService.authenticationError();
         }
       })
       .finally(function () {

        });
     };

对于按钮 -

<button type="submit" ng-click = "sendAllMessages()" class="button-size btn btn-primary">Send  </button>

那么,我该如何解决这个问题?

【问题讨论】:

    标签: javascript jquery angularjs arrays checkbox


    【解决方案1】:

    你所做的并不是实现你所需要的角度

    但是,如果您需要以与您相同的方式进行操作,那么您应该进行以下更改。

    如果未选中,则应从数组中删除该值,使用messages.splice(index, 1);

    这是你修改后的代码,没有 ng-model(不推荐)

    var messages = [];
    
       $scope.getcheckedData = function(SelectedVal) {     
    
              if ($.inArray(SelectedVal , messages) === -1){
                    messages.push(SelectedVal);
               }
               else
               {
               var index = messages.indexOf(SelectedVal)
               messages.splice(index, 1);
               }
    
             return messages;
      };
    

    要以角度方式实现,需要使用ng-model

    这是一个使用 Angular 的示例

    var app = angular.module('app', []);
    
    function Ctrl($scope) {
       
        $scope.messages = {
          
        };
    
        $scope.reports = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ];
        
    }
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <div ng-controller="Ctrl" ng-app="app">
        <span ng-repeat="report in reports">
          <label class="checkbox" for="{{report.id}}">
            <input type="checkbox" ng-model="messages[report.id]" name="group" id="{{report.id}}" />
            {{report.name}}
          </label>
        </span>
        <pre ng-bind="messages | json"></pre>    
    </div>

    【讨论】:

    • 感谢您的帮助,实际上它对我不起作用。如果我选中然后添加数组,但如果我取消选中,那么它也保留在数组中。但是下次当我检查时,它会从 array.check 中删除并且取消检查是不正确的。
    • 好的,让我帮你。首先,您要遵循哪种方式,以便我们可以相应地进行
    • 我正在使用的第一个。
    • 只是console.log(index),在您的索引线下方并检查您是否获得索引
    • 所以,这里发生了什么,当我第一次检查然后它添加到数组中,当我取消选中同一行然后它仍然在数组中,但是当我再次检查然后它从大批。那个时候它显示索引 0。
    猜你喜欢
    • 2016-10-13
    • 2020-09-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-12-24
    • 2014-02-03
    • 1970-01-01
    相关资源
    最近更新 更多