为什么以下功能没有选择该指令中的所有复选框?

时间:2016-01-06 01:48:04

标签: javascript angularjs checkbox

以下指令有两个表格:一个带有复选框,另一个没有复选框。它还有一个选择所有复选框的功能:

      package rysuje;

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.io.File;
import java.util.ArrayList;
import java.util.Locale;
import java.util.Scanner;

import javax.swing.JFrame;
import javax.swing.JPanel;

public class Rysowanie extends JPanel {

    ArrayList<Double> liczby = new ArrayList<Double>();

    public Rysowanie () {
        try {
            File file = new File("pliki/wynik5.xyz");
            Scanner input = new Scanner(file);
            input.useLocale(Locale.ENGLISH);

            while (input.hasNextDouble()) {
                dodajLiczbe(input.nextDouble());
            }
            input.close();

        } catch (Exception ex) {
            ex.printStackTrace();
        }
        System.out.println("Załadowalem tyle plikow: "+ileLiczb());
    }

    public void dodajLiczbe(double liczba) {
        liczby.add(liczba);
    }

    public Double wezLiczbe(int indeks) {
        return liczby.get(indeks);
    }

    public int ileLiczb() {
        return liczby.size();
    }

    public void paintComponent(Graphics g) {

        super.paintComponent(g);

        int x;
        int z;
        int c = 0;
        int d = (int) 0.1;
        int e = 2;
        for (int i = 0; i < liczby.size(); i++) {
            x = (int) (wezLiczbe(e) * Math.sin(wezLiczbe(c) * Math.pow(10, -6)));
            z = (int) (wezLiczbe(e) * Math.cos(wezLiczbe(c) * Math.pow(10, -6)));

            g.setColor(Color.black);
            g.drawOval(x, z, d, d);
            if (c < liczby.size()-3 ) {
            c = c + 3;
            }
            else if (e < liczby.size()-3) {
            e = e + 3;
            }
        }
    }

    public Dimension getPreferredSize() {
        return new Dimension(200, 200);
    }

    public static void main(String[] args) {

        JFrame frame = new JFrame("NIE WIEM");
        JPanel world = new Rysowanie();
        frame.getContentPane().add(world);
        frame.setLocation(200, 200);
        frame.setVisible(true);
        frame.pack();
    }
}

复选框有效。这是我检查第一项时的样子:

  .directive('tableList', function() {
    return {
      restrict: 'EA',
      template: '<button ng-if="listAll" type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">' +
      'Launch demo modal' +
    '</button>' +
    '<table class="table table-stripped">' +
    '<thead>' +
        '<th>SOME CODE</th>' +
      '</tr>' +
    '</thead>' +
    '<tbody>' +
      '<tr ng-repeat="item in listThis">' +
        '<th scope="row">{{$index + 1}}</th>' +
        '<td><a href="#/groups/{{item.id}}">{{item.name}}</a></td>' +
        '<td>SOME CODE</td>' +
      '</tr>' +
    '</tbody>' +
      '</table>' +
      '<div ng-if="listAll" class="" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">' +
    '<div class="modal-dialog">' +
      '<div class="modal-content">' +
        '<div class="modal-header">' +
          '<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
          '<h4 class="modal-title">Modal title</h4>' +
        '</div>' +
        '<div class="modal-body">' +
          '<table class="table table-stripped list-all">' +
        '<thead>' +
          '<tr>' +
            '<th><input type="checkbox" ng-model="selectedAll" ng-click="checkAll()" /></th>' +
            '<th>SOME CODE</th>' +
          '</tr>' +
        '</thead>' +
        '<tbody>' +
          '<tr ng-repeat="item in listAll">' +
            '<th scope="row"><input type="checkbox" value="0" ng-model="item.selected"></th>' +
            '<td><a href="#/groups/{{item.id}}">{{item.name}}</a></td>' +
            '<td>SOME CODE</td>' +
          '</tr>' +
        '</tbody>' +
          '</table>' +
        '</div>' +
        '<div class="modal-footer">' +
          '<button type="button" class="btn btn-primary">Save changes</button>' +
        '</div>' +
      '</div><!-- /.modal-content -->' +
    '</div><!-- /.modal-dialog -->' +
      '</div><!-- /.modal -->',
      scope: {
    listThis: "=",
    listAll: "=",
    submit: "&"
      },
      controller: function() {
      },
      link: function(scope, elem, attr, ctrl) {
    scope.checkAll = function() {
      if (scope.selectedAll) {
        scope.selectedAll = true
      } else {
        scope.selectedAll = false
      }
      angular.forEach(scope.listAll, function (item) {
        item.selected = scope.selectedAll
      })
    }
      }
  };
})

但是当我点击复选框检查所有项目时没有任何反应:

enter image description here

可能是什么问题?

这就是我使用该指令的方式:

[
  {
    "id": "1",
    "name": "User 1",
    "selected": true
  },
  {
    "id": "2",
    "name": "User 2",
    "selected": false
  },
  {
    "id": "3",
    "name": "User 3",
    "selected": false
  }
]

1 个答案:

答案 0 :(得分:1)

问题在于此代码:

if (scope.selectedAll) {
    scope.selectedAll = true
} else {
    scope.selectedAll = false
}

这句话没有意义,因为如果scope.selectedAll最初为假,if (scope.selectedAll) { scope.selectedAll = false } else { scope.selectedAll = true } 永远不会变为真,反之亦然 - 它永远不会改变价值。可能是你的意思:

VariableShadowing