Javascript 基于当前筛选器筛选源数组,并将其特定值放入ng repeat项

Javascript 基于当前筛选器筛选源数组,并将其特定值放入ng repeat项,javascript,angularjs,angularjs-filter,Javascript,Angularjs,Angularjs Filter,我有一个名为时间表的数组,其中包含所有航班时间表信息。当用户选择出发城市和到达城市时,该数组将按所选城市进行过滤,并在表中输出航班。该表还包含最初源阵列计划没有的返回航班数据列。但是有一个值ret\u flight\u num 我想将返回的航班数据加载到当前行,但仍然不知道如何实现。有什么建议吗 var-app=angular.module('flight-schedule',[]); 应用程序控制器('SelectCtrl',函数($scope){ $scope.flights=[ { 城市

我有一个名为时间表的数组,其中包含所有航班时间表信息。当用户选择出发城市和到达城市时,该数组将按所选城市进行过滤,并在表中输出航班。该表还包含最初源阵列计划没有的返回航班数据列。但是有一个值ret\u flight\u num

我想将返回的航班数据加载到当前行,但仍然不知道如何实现。有什么建议吗

var-app=angular.module('flight-schedule',[]);
应用程序控制器('SelectCtrl',函数($scope){
$scope.flights=[
{
城市:“阿什哈巴德”,
目的地:[“阿拉木图”、“阿姆利则”]
},
{
城市:“阿姆利则”,
目的地:[“阿什哈巴德”]
},
{
城市:“阿拉木图”,
目的地:[“阿什哈巴德”]
}
];
$scope.schedules=[{
“来自城市”:“阿什哈巴德”,
“阿拉木图市”:“阿拉木图”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-717”,
“飞机”:“B-737-700”,
“副部长日”:5,
“dep_time”:“08-40”,
“着陆时间”:“12-30”,
“返回航班号”:“T5-718”
}, {
“来自城市”:“阿什哈巴德”,
“阿拉木图市”:“阿拉木图”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-715”,
“飞机”:“B-737-700”,
“环保日”:7,
“dep_time”:“20-20”,
“着陆时间”:“*00-10”,
“返回航班号”:“T5-716”
}, {
“阿拉木图市”:“阿拉木图”,
“阿什哈巴德市”:“阿什哈巴德”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-718”,
“飞机”:“B-737-700”,
“副部长日”:5,
“dep_time”:“14-00”,
“着陆时间”:“16-00”,
“返回航班号”:“T5-715”
}, {
“阿拉木图市”:“阿拉木图”,
“阿什哈巴德市”:“阿什哈巴德”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-716”,
“飞机”:“B-737-700”,
“环保日”:1,
“dep_时间”:“01-40”,
“着陆时间”:“03-40”,
“返回航班号”:“T5-717”
}, {
“来自城市”:“阿什哈巴德”,
“城市”——“阿姆利则”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-551”,
“飞机”:“B-757-200”,
“环保日”:1,
“dep_时间”:“06-20”,
“着陆时间”:“09-30”,
“返回航班号”:“T5-552”
}, {
“来自城市”:“阿什哈巴德”,
“城市”——“阿姆利则”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-715”,
“飞机”:“B-737-700”,
“副部长日”:3,
“dep_时间”:“03-25”,
“着陆时间”:“06-35”,
“返回航班号”:“T5-554”
}, {
“来自城市”:“阿姆利则”,
“阿什哈巴德市”:“阿什哈巴德”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-718”,
“飞机”:“B-737-700”,
“环保日”:2,
“dep_时间”:“06-30”,
“着陆时间”:“08-45”,
“返回航班号”:“T5-553”
}, {
“来自城市”:“阿姆利则”,
“阿什哈巴德市”:“阿什哈巴德”,
“航空公司”:“Türkmenhowaýollary DMG”,
“航班号”:“T5-716”,
“飞机”:“B-737-700”,
“副部长日”:3,
“dep_时间”:“08-05”,
“着陆时间”:“10-20”,
“返回航班号”:“T5-551”
}];
});
表格{
边界塌陷:塌陷;
文本对齐:居中;
}
td,th{
边框:1px实心#ddd;
}
格雷先生{
背景色:#ccc;
}

航班时刻表
出发城市:
选择出发城市

所选德帕鲁尔市:{{data.dep_city.city} 抵达城市: 选择到达城市

所选到达城市:{{data.arr_city}

航空公司 航班号 飞机 出发日 出发时间 着陆时间 回程航班号 回程航班起飞日 返程航班起飞时间 返航着陆时间 {{flight.aviacompany} {{flight.flight_num} {{飞行.飞机} {{flight.dep_day} {{flight.dep_time} {{飞行.着陆时间} {{flight.ret_flight_num} 航班时刻表
您可以使用

逻辑很简单:

  • 找到返程航班
  • 获取数据
  • 显示表中的数据
  • 请参阅代码中的注释(在
    过滤器
    部分中)以更好地理解

    var-app=angular.module('flight-schedule',[]);
    应用程序控制器('SelectCtrl',函数($scope){
    $scope.flights=[
    {
    城市:“阿什哈巴德”,
    目的地:[“阿拉木图”、“阿姆利则”]
    },
    {
    城市:“阿姆利则”,
    目的地:[“阿什哈巴德”]
    },
    {
    城市:“阿拉木图”,
    目的地:[“阿什哈巴德”]
    }
    ];
    $scope.schedules=[{
    “来自城市”:“阿什哈巴德”,
    “阿拉木图市”:“阿拉木图”,
    “航空公司”:“Türkmenhowaýollary DMG”,
    “航班号”:“T5-717”,
    “飞机”:“B-737-700”,
    “副部长日”:5,
    “dep_time”:“08-40”,
    “着陆时间”:“12-30”,
    “返回航班号”:“T5-718”
    }, {
    “来自城市”:“阿什哈巴德”,
    “阿拉木图市”:“阿拉木图”,
    “航空公司”:“Türkmenhowaýollary DMG”,
    “航班号”:“T5-715”,
    “飞机”:“B-737-700”,
    “环保日”:7,
    “dep_time”:“20-20”,
    “着陆时间”:“*00-10”,
    “返回航班号”:“T5-716”
    }, {
    “阿拉木图市”:“阿拉木图”,
    “阿什哈巴德市”:“阿什哈巴德”,
    “航空公司”:“Türkmenhowaýollary DMG”,
    “航班号”:“T5-718”,
    “飞机”:“B-737-700”,
    “副部长日”:5,
    “dep_time”:“14-00”,
    “着陆时间”:“16-00”,
    “返回航班号”:“T5-715”
    }, {
    “阿拉木图市”:“阿拉木图”,
    “阿什哈巴德市”:“阿什哈巴德”,
    “航空公司”:“Türkmenhowaýollary DMG”,
    “航班号”:“T5-716”,
    “飞机”:“B-737-700”,
    “环保日”:1,
    “dep_时间”:“01-40”,
    “着陆时间”:“03-40”,
    “返回航班号”:“T5-717”
    }, {
    “来自城市”:“阿什哈巴德”,
    “城市”——“阿姆利则”,
    “阿维亚科
    
      $scope.schedules.forEach(function(item, i, arr){
        $scope.schedules.forEach(function(item2, i2, arr2){
           if(item.ret_flight_num == item2.flight_num && item.city_from == item2.city_to && item2.city_from == item.city_to){
                item.day = item2.dep_day;
                item.deptime = item2.dep_time;
                item.landtime = item2.land_time;
           }
         });
      });
    
      <tr ng-repeat="flight in schedules | filter:{city_from: data.dep_city.city, city_to: data.arr_city}">
        <td>{{flight.aviacompany}}</td>
        <td>{{flight.flight_num}}</td>
        <td>{{flight.aircraft}}</td>
        <td>{{flight.dep_day}}</td>
        <td>{{flight.dep_time}}</td>
        <td>{{flight.land_time}}</td>
        <td class="gray">{{flight.ret_flight_num}}</td>
    
        <td>{{flight.day}}</td>
        <td>{{flight.deptime}}</td>
        <td>{{flight.landtime}}</td>
      </tr>