2016-09-08 2 views
1

저는 며칠 동안이 문제를 해결하기 위해 노력해 왔습니다. 내가 내가 하나 개 이상의 ID를 체크 박스 예를 들어,이 ID 데이터가 enter image description here필터 Json AngularJS와 함께 확인란 사용

사용자가 체크 박스 (모델 번호)를 선택하면, 모델 필터링 기반됩니다 나머지를 표시, 체크 박스를 사용하여 JSON 데이터를 필터링하기 위해 노력하고있어 그 확인란의 선택에

controller('compareModelsCtrl',['$scope','$http', '$state' ,'$location', 
    function($scope, $http, $state,$location, filterFilter) { 
    $http.get('js/data.json').success(function(data){ 
    $scope.models = data; 
    $scope.whichmodel = $state.params.modelId; 
$scope.order = {}; 

    $scope.format=function(){ 
    $scope.modifiedOrder=[]; 
    angular.forEach($scope.order, function(value, key) { 
    if(value){ 
     $scope.modifiedOrder.push(parseInt(key)); 
    } 
}); 


    <ion-checkbox ng-repeat="model in models | filter:query" ng-model="order[model.id]" ng-change="format()">{{model.model_number}}</ion-checkbox> 
      </ion-item> 
      current order : {{modifiedOrder}} 

어떤 도움을 이해할 수있을 것이다

{ 
    "id":"0", 
    "model_number":"BT168562.3", 
    "rotor_drawing_number":4.01591, 
    "material":"17-4 PH", 
    "number_of_lobes":"5/6", 
    "contour_length":51.00, 
    "overall_length":55.00, 
    "major_dia_in":1.063, 
    "minor_dia_in":0.761, 
    "rotor_head_dia_in":1.000, 
    "thread_form":"N/A", 
    "rotor_weight_lbs":11, 
    "rotor_ecc":0.0755, 
    "compatibility_weatherford":"", 
    "compatibility_r_&_m":"TRUE", 
    "compatibility_dyna_drill":"", 
    "compatibility_mono_pv":"", 
    "compatibility_roper":"", 
    "stator_drawing_number":4.0162, 
    "stator_length_in":60.00, 
    "stator_contour_in":52.00, 
    "cutback_top":4.00, 
    "cutback_end":4.00, 
    "tube_od":1.6875, 
    "tube_id_ends":1.38, 
    "tube_id_middle":1.38, 
    "stator_number_of_stages":2.3, 
    "stator_weight_lbs":14, 
    "std_vector_nbr_55":0.913, 
    "std_vector_nbr_hp":0.913, 
    "fit_5_os_vector_nbr_55":0.000, 
    "fit_5_os_vector_nbr_hp":0.000, 
    "fit_1_0_os_vector_nbr_55":0.000, 
    "fit_1_0_os_vector_nbr_hp":0.000, 
    "fit_1_5_os_vector_nbr_55":0.000, 
    "fit_1_5_os_vector_nbr_hp":0.000, 
    "fit_2_0_os_vector_nbr_55":0, 
    "fit_2_0_os_vector_nbr_hp":0.000, 
    "2_us_vector_nbr_55":0, 
    "2_us_vector_nbr_hp":0, 
    "fit_1_5_us_vector_nbr_55":0, 
    "fit_1_5_us_vector_nbr_hp":0, 
    "fit_1_0_us_vector_nbr_55":0.903, 
    "fit_1_0_us_vector_nbr_hp":0.903, 
    "fit_5_us_vector_nbr_55":0, 
    "fit_5_us_vector_nbr_hp":0, 
    "fit_2_5_os_vector_nbr_55":0, 
    "fit_2_5_os_vector_nbr_hp":0, 
    "fit_3_os_vector_nbr_55":0, 
    "fit_3_os_vector_nbr_hp":0, 
    "tolerance":0.010, 
    "nbr_thermal_expansion_coef":0.000190, 
    "nbr_hp_thermal_expansion_coef":0.000190, 
    "number_of_stages":2.3, 
    "rev_per_gal":9.25, 
    "torque_slope_ft_lb_psi":0.29, 
    "pressure_per_stage_nbr_55_psi":150, 
    "pressure_per_stage_nbr_hp_psi":225, 
    "pressure_per_stage_nbr_hpx_psi":235, 
    "plot_gpm_1":20, 
    "plot_gpm_2":30, 
    "plot_gpm_3":40, 
    "slip_at_gpm_2":"15%", 
    "":0, 
    "flow_range_low":20, 
    "flow_range_high":40, 
    "speed_range_low":185, 
    "speed_range_high":370, 
    "off_bottom_pressure":31, 
    "max_diff_pressure_nbr":345, 
    "max_diff_pressure_nbr_hpx":541, 
    "stall_diff_pressure_nbr":518, 
    "stall_diff_pressure_nbr_hpx":851, 
    "max_torque_nbr":100, 
    "max_torque_nbr_hpx":157, 
    "stall_torque_nbr":185, 
    "}, 

    "id":"1", 
    "model_number":"BT168565.0", 
    "rotor_drawing_number":4.01530, 
    "material":"17-4 PH", 
    "number_of_lobes":"5/6", 
    "contour_length":87.00, 
    "overall_length":93.00, 
    "major_dia_in":0.990, 
    "minor_dia_in":0.714, 
    "rotor_head_dia_in":1.100, 
    "thread_form":"N/A", 
    "rotor_weight_lbs":16, 
    "rotor_ecc":0.0690, 
    "compatibility_weatherford":"", 
    "compatibility_r_&_m":"TRUE", 
    "compatibility_dyna_drill":"", 
    "compatibility_mono_pv":"", 
    "compatibility_roper":"TRUE", 
    "stator_drawing_number":4.01637, 
    "stator_length_in":99.00, 
    "stator_contour_in":91.00, 
    "cutback_top":4.00, 
    "cutback_end":4.00, 
    "tube_od":1.6875, 
    "tube_id_ends":1.38, 
    "tube_id_middle":1.38, 
    "stator_number_of_stages":5.0, 
    "stator_weight_lbs":27, 
    "std_vector_nbr_55":0.853, 
    "std_vector_nbr_hp":0.853, 
    "fit_5_os_vector_nbr_55":0.000, 
    "fit_5_os_vector_nbr_hp":0.000, 
    "fit_1_0_os_vector_nbr_55":0.863, 
    "fit_1_0_os_vector_nbr_hp":0.863, 
    "fit_1_5_os_vector_nbr_55":0.000, 
    "fit_1_5_os_vector_nbr_hp":0.000, 
    "fit_2_0_os_vector_nbr_55":0, 
    "fit_2_0_os_vector_nbr_hp":0, 
    "2_us_vector_nbr_55":0, 
    "2_us_vector_nbr_hp":0, 
    "fit_1_5_us_vector_nbr_55":0, 
    "fit_1_5_us_vector_nbr_hp":0, 
    "fit_1_0_us_vector_nbr_55":0, 
    "fit_1_0_us_vector_nbr_hp":0, 
    "fit_5_us_vector_nbr_55":0, 
    "fit_5_us_vector_nbr_hp":0, 
    "fit_2_5_os_vector_nbr_55":0, 
    "fit_2_5_os_vector_nbr_hp":0, 
    "fit_3_os_vector_nbr_55":0, 
    "fit_3_os_vector_nbr_hp":0, 
    "tolerance":0.010, 
    "nbr_thermal_expansion_coef":0.000190, 
    "nbr_hp_thermal_expansion_coef":0.000190, 
    "number_of_stages":5.0, 
    "rev_per_gal":15.72, 
    "torque_slope_ft_lb_psi":0.19, 
    "pressure_per_stage_nbr_55_psi":150, 
    "pressure_per_stage_nbr_hp_psi":225, 
    "pressure_per_stage_nbr_hpx_psi":235, 
    "plot_gpm_1":25, 
    "plot_gpm_2":40, 
    "plot_gpm_3":55, 
    "slip_at_gpm_2":"15%", 
    "":0, 
    "flow_range_low":25, 
    "flow_range_high":55, 
    "speed_range_low":393, 
    "speed_range_high":865, 
    "off_bottom_pressure":67, 
    "max_diff_pressure_nbr":750, 
    "max_diff_pressure_nbr_hpx":1175, 
    "stall_diff_pressure_nbr":1125, 
    "stall_diff_pressure_nbr_hpx":1851, 
    "max_torque_nbr":143, 
    "max_torque_nbr_hpx":223, 
    "stall_torque_nbr":393, 
    "stall_torque_nbr_hpx":865 
    } 

DataJson, 감사

+0

최종 데이터의 모양을 명확히 할 수 있습니까? 즉, 그 질문은 명확하지 않다. 목표는 무엇입니까? 선택되지 않은 ID를 원하십니까? –

+0

아니요, 두 개 이상의 확인란을 선택하면 id와 그 값 사이의 비교 페이지처럼 (material, number_of_lobes)와 같은 datajson의 다른 정보와 함께 ID가 표시됩니다. –

+0

질문이 아직 명확하지 않습니다. . 다른 정보와 함께 이드가 표시되었다고 말 했나요? 어디 보여? 아니면 선택된 ID를 기반으로 JSON 데이터에서 필터링 된 다른 JSON을 원합니까? –

답변

1

우선 귀하의 질문에 문제를 포맷하기 있었다

[{ 
    "id":"0", 
    "model_number":"BT168562.3", 
    "rotor_drawing_number":4.01591, 
    "material":"17-4 PH", 
    "number_of_lobes":"5/6", 
    "contour_length":51.00, 
    "overall_length":55.00, 
    "major_dia_in":1.063, 
    "minor_dia_in":0.761, 
    "rotor_head_dia_in":1.000, 
    "thread_form":"N/A", 
    "rotor_weight_lbs":11, 
    "rotor_ecc":0.0755, 
    "compatibility_weatherford":"", 
    "compatibility_r_&_m":"TRUE", 
    "compatibility_dyna_drill":"", 
    "compatibility_mono_pv":"", 
    "compatibility_roper":"", 
    "stator_drawing_number":4.0162, 
    "stator_length_in":60.00, 
    "stator_contour_in":52.00, 
    "cutback_top":4.00, 
    "cutback_end":4.00, 
    "tube_od":1.6875, 
    "tube_id_ends":1.38, 
    "tube_id_middle":1.38, 
    "stator_number_of_stages":2.3, 
    "stator_weight_lbs":14, 
    "std_vector_nbr_55":0.913, 
    "std_vector_nbr_hp":0.913, 
    "fit_5_os_vector_nbr_55":0.000, 
    "fit_5_os_vector_nbr_hp":0.000, 
    "fit_1_0_os_vector_nbr_55":0.000, 
    "fit_1_0_os_vector_nbr_hp":0.000, 
    "fit_1_5_os_vector_nbr_55":0.000, 
    "fit_1_5_os_vector_nbr_hp":0.000, 
    "fit_2_0_os_vector_nbr_55":0, 
    "fit_2_0_os_vector_nbr_hp":0.000, 
    "2_us_vector_nbr_55":0, 
    "2_us_vector_nbr_hp":0, 
    "fit_1_5_us_vector_nbr_55":0, 
    "fit_1_5_us_vector_nbr_hp":0, 
    "fit_1_0_us_vector_nbr_55":0.903, 
    "fit_1_0_us_vector_nbr_hp":0.903, 
    "fit_5_us_vector_nbr_55":0, 
    "fit_5_us_vector_nbr_hp":0, 
    "fit_2_5_os_vector_nbr_55":0, 
    "fit_2_5_os_vector_nbr_hp":0, 
    "fit_3_os_vector_nbr_55":0, 
    "fit_3_os_vector_nbr_hp":0, 
    "tolerance":0.010, 
    "nbr_thermal_expansion_coef":0.000190, 
    "nbr_hp_thermal_expansion_coef":0.000190, 
    "number_of_stages":2.3, 
    "rev_per_gal":9.25, 
    "torque_slope_ft_lb_psi":0.29, 
    "pressure_per_stage_nbr_55_psi":150, 
    "pressure_per_stage_nbr_hp_psi":225, 
    "pressure_per_stage_nbr_hpx_psi":235, 
    "plot_gpm_1":20, 
    "plot_gpm_2":30, 
    "plot_gpm_3":40, 
    "slip_at_gpm_2":"15%", 
    "":0, 
    "flow_range_low":20, 
    "flow_range_high":40, 
    "speed_range_low":185, 
    "speed_range_high":370, 
    "off_bottom_pressure":31, 
    "max_diff_pressure_nbr":345, 
    "max_diff_pressure_nbr_hpx":541, 
    "stall_diff_pressure_nbr":518, 
    "stall_diff_pressure_nbr_hpx":851, 
    "max_torque_nbr":100, 
    "max_torque_nbr_hpx":157, 
    "stall_torque_nbr":185, 
    }, 

    {"id":"1", 
    "model_number":"BT168565.0", 
    "rotor_drawing_number":4.01530, 
    "material":"17-4 PH", 
    "number_of_lobes":"5/6", 
    "contour_length":87.00, 
    "overall_length":93.00, 
    "major_dia_in":0.990, 
    "minor_dia_in":0.714, 
    "rotor_head_dia_in":1.100, 
    "thread_form":"N/A", 
    "rotor_weight_lbs":16, 
    "rotor_ecc":0.0690, 
    "compatibility_weatherford":"", 
    "compatibility_r_&_m":"TRUE", 
    "compatibility_dyna_drill":"", 
    "compatibility_mono_pv":"", 
    "compatibility_roper":"TRUE", 
    "stator_drawing_number":4.01637, 
    "stator_length_in":99.00, 
    "stator_contour_in":91.00, 
    "cutback_top":4.00, 
    "cutback_end":4.00, 
    "tube_od":1.6875, 
    "tube_id_ends":1.38, 
    "tube_id_middle":1.38, 
    "stator_number_of_stages":5.0, 
    "stator_weight_lbs":27, 
    "std_vector_nbr_55":0.853, 
    "std_vector_nbr_hp":0.853, 
    "fit_5_os_vector_nbr_55":0.000, 
    "fit_5_os_vector_nbr_hp":0.000, 
    "fit_1_0_os_vector_nbr_55":0.863, 
    "fit_1_0_os_vector_nbr_hp":0.863, 
    "fit_1_5_os_vector_nbr_55":0.000, 
    "fit_1_5_os_vector_nbr_hp":0.000, 
    "fit_2_0_os_vector_nbr_55":0, 
    "fit_2_0_os_vector_nbr_hp":0, 
    "2_us_vector_nbr_55":0, 
    "2_us_vector_nbr_hp":0, 
    "fit_1_5_us_vector_nbr_55":0, 
    "fit_1_5_us_vector_nbr_hp":0, 
    "fit_1_0_us_vector_nbr_55":0, 
    "fit_1_0_us_vector_nbr_hp":0, 
    "fit_5_us_vector_nbr_55":0, 
    "fit_5_us_vector_nbr_hp":0, 
    "fit_2_5_os_vector_nbr_55":0, 
    "fit_2_5_os_vector_nbr_hp":0, 
    "fit_3_os_vector_nbr_55":0, 
    "fit_3_os_vector_nbr_hp":0, 
    "tolerance":0.010, 
    "nbr_thermal_expansion_coef":0.000190, 
    "nbr_hp_thermal_expansion_coef":0.000190, 
    "number_of_stages":5.0, 
    "rev_per_gal":15.72, 
    "torque_slope_ft_lb_psi":0.19, 
    "pressure_per_stage_nbr_55_psi":150, 
    "pressure_per_stage_nbr_hp_psi":225, 
    "pressure_per_stage_nbr_hpx_psi":235, 
    "plot_gpm_1":25, 
    "plot_gpm_2":40, 
    "plot_gpm_3":55, 
    "slip_at_gpm_2":"15%", 
    "":0, 
    "flow_range_low":25, 
    "flow_range_high":55, 
    "speed_range_low":393, 
    "speed_range_high":865, 
    "off_bottom_pressure":67, 
    "max_diff_pressure_nbr":750, 
    "max_diff_pressure_nbr_hpx":1175, 
    "stall_diff_pressure_nbr":1125, 
    "stall_diff_pressure_nbr_hpx":1851, 
    "max_torque_nbr":143, 
    "max_torque_nbr_hpx":223, 
    "stall_torque_nbr":393, 
    "stall_torque_nbr_hpx":865 
    }] 

로 JSON 데이터 나 모델이 있는지 확인합니다.

둘째, 필터 기능을 사용해야합니다. selectedObjects이라는 이름의 필터링 된 개체를 만들고 format 함수의 값을 수정하고 HTML에 다음과 같이 표시했습니다.

<ion-checkbox ng-repeat="model in models | filter:query" ng-model="order[model.id]" ng-change="format()">{{model.model_number}}</ion-checkbox> 
    <pre> 
    current order : {{modifiedOrder}} <br> 
    selected objects:{{selectedObjects}} </pre> 

그리고 JS

이 구현은 ID가 JSON에서 유일한 것으로 가정합니다. 여기

$scope.order = {}; 
     $scope.format = function() { 
       $scope.modifiedOrder = []; 
       $scope.selectedObjects = []; 
       angular.forEach($scope.order, function(value, key) { 
        if (value) { 
          var filtered = $scope.models.filter(function(unit) { 
           return unit.id === key 
          }); 
          $scope.selectedObjects.push({ 
            "overall_length":filtered[0].overall_length, 
           "contour_length": filtered[0].contour_length 
          }); 

          $scope.modifiedOrder.push(parseInt(key)); 
        } 
       }); 
     } 

찾기 샘플 구현. https://codepen.io/anon/pen/BLNJzB?editors=1010 행운을 비네.

+0

도움을 주셔서 감사합니다.하지만이 모든 데이터를 보여줍니다. http://i.imgur.com/mON5fcc.png , 어떻게 하나 또는 두 개만 선택할 수 있습니까? –

+0

하나 또는 둘을 선택하면 무엇을 의미합니까? JSON에서 하나 또는 두 개의 항목을 선택하기 만하면 필터링 된 후에 JSON을 수정해야합니다. –

+0

json 데이터, 방금 두 개 항목을 반환하고 싶었습니다. 어떻게 contour_length "로 돌아가려면 수정할 수 있습니까 : 51.00, "overall_length ": 55.00, 대신 모든 정보 –