问题描述

我有一个 Angular 6 项目。我有一个包含 20 个组合框和一些文本框的表单，如下图所示。所以，我在页面加载时绑定了组合框项。有两种方法可以做到这一点，如下所示。

第一种方法：

.ts 文件

onInit(){
   let countries= this.http.get("getCountries");
   let cities= this.http.get("getCities");
   let states= this.http.get("getStates");
   let universities= this.http.get("getUniversities");
   let elementarySchools= this.http.get("getElementarySchools");
   let studentTypes= this.http.get("getStudentTypes");
   let universityTypes= this.http.get("getUniversityTypes");
   let genders= this.http.get("getGenders");
   let diseaseTypes= this.http.get("getDiseaseTypes");
   let accessTypes= this.http.get("getAccessTypes");
   let appealTypes= this.http.get("getAppealTypes");
   let computerBrands= this.http.get("getComputerBrands");
   let carTypes= this.http.get("getCarTypes");
   let positions= this.http.get("getPositions");
   let workingTypes= this.http.get("getWorkingTypes");
   let travelTypes= this.http.get("getTravelTypes");
   let feedbacks= this.http.get("getFeedbacks");
   let contactTypes= this.http.get("getContactTypes");
   let maritalStatus= this.http.get("getMaritalStatus");
}

ApiController.cs

public List<string> getCountries()
 { return new List<string>{"sgh","shd","dfh"}; }
public List<string> getCities()
 { return new List<string>{"agg","dfh","dfj"}; }
public List<string> getStates()
 { return new List<string>{"ghf","ghj","jhk"}; }
public List<string> getUniversities()
 { return new List<string>{"sdh","dfj","hgj"}; }
public List<string> getElementarySchools()
 { return new List<string>{"jhg","fdh","fsg"}; }
public List<string> getStudentTypes()
 { return new List<string>{"asf","sdf","fdh"}; }
public List<string> getUniversityTypes()
 { return new List<string>{"fdh","asd","tyr"}; }
public List<string> getGenders()
 { return new List<string>{"ewt","ret","uer"}; }
public List<string> getDiseaseTypes()
 { return new List<string>{"asd","zxc","vbn"}; }
public List<string> getAccessTypes()
 { return new List<string>{"wet","wtt","yrx"}; }
public List<string> getAppealTypes()
 { return new List<string>{"asd","zxc","vbn"}; }
public List<string> getComputerBrands()
 { return new List<string>{"asd","zxc","dfh"}; }
public List<string> getCarTypes()
 { return new List<string>{"asd","zxc","sdf"}; }
public List<string> getPositions()
 { return new List<string>{"asd","zxc","bfg"}; }
public List<string> getWorkingTypes()
 { return new List<string>{"dfh","zxc","dhj"}; }
public List<string> getTravelTypes()
 { return new List<string>{"hgj","zxc","jfd"}; }
public List<string> getFeedbacks()
 { return new List<string>{"khg","zxc","vbn"}; }
public List<string> getContactTypes()
 { return new List<string>{"cvn","zxc","gsh"}; }
public List<string> getMaritalStatus()
 { return new List<string>{"dfh","zxc","vbn"}; }

第二种方法：

.ts 文件

onInit(){
  this.http.get("getAllComboboxBindingLists");
}

ApiController.cs

public List<List<string>> getAllComboboxBindingLists()
{
   var resultList = new List<List<string>>();
   resultList.Add(new List<string>{"sgh","shd","dfh"});
   resultList.Add(new List<string>{"dfg","fgh","dhh"});
   resultList.Add(new List<string>{"hjf","gfh","sdf"});
   resultList.Add(new List<string>{"sjf","ghj","dfj"});
   resultList.Add(new List<string>{"agg","fdg","fgj"});
   resultList.Add(new List<string>{"nfd","ghj","fdg"});
   resultList.Add(new List<string>{"ghj","dfh","dfj"});
   resultList.Add(new List<string>{"ghk","hjk","ghj"});
   resultList.Add(new List<string>{"agg","yuı","gfh"});
   resultList.Add(new List<string>{"ret","yuı","yuı"});
   resultList.Add(new List<string>{"ghj","dfh","dfj"});
   resultList.Add(new List<string>{"fjj","gfh","tyu"});
   resultList.Add(new List<string>{"set","dfg","dfj"});
   resultList.Add(new List<string>{"yru","tuı","try"});
   resultList.Add(new List<string>{"tru","dfh","hjg"});
   resultList.Add(new List<string>{"agg","wry","dfj"});
   resultList.Add(new List<string>{"ghj","hjk","dfj"});
   resultList.Add(new List<string>{"dfg","fgj","dfj"});
   resultList.Add(new List<string>{"yjg","yır","rjf"});
   resultList.Add(new List<string>{"rwy","tru","ıtu"});
   return resultList;
}

第一种方法的优缺点

优点：我们可以在其他页面中使用方法。因为每个方法都有自己的方法。Foreample，您可以从任何地方调用“getUniversityTypes”。
缺点：我们向服务器发送 20 个请求

第二种方法的优缺点

优点：我们只向服务器发送一个请求
缺点：我们不能使用其他页面的方法。因为在controller.cs 中，只有一种方法可以获取所有值。因此，您不能只使用“getUniversityTypes”

我的问题

这两种方法有什么性能差异吗？有多少？因为，我的应用程序将被数百万人使用，并且会有数百个这样的页面。而这种性能差异对我来说非常重要。（我认为，第一种方法会因为 20 次请求而对服务器感到厌倦）

标签： c#angularperformancetypescriptasp.net-core-webapi

如果您确定需要经常将所有列表类型放在一起，这取决于您的要求（通过查看图像，我会推荐第二种，因为您需要将它们全部放在一起）然后使用第二种方法并对其进行修改以接受列出类型参数并将类型写入字典，如下所示，否则采用第一种方法

public Dictionary<string,List<string>> getAllComboboxBindingLists(string listTypes)
{
   var resultList = new  Dictionary<string,List<string>>>();
   resultList.Add('carTypes',new List<string>{"sgh","shd","dfh"});
   resultList.Add('studentTypes',new List<string>{"dfg","fgh","dhh"});
   if(listTypes != null)//here listtypes will be a semicolon spllitted string like 'type1;type2'
   {
    var splittedList=listTypes.split(';');
     resultList=resultList.where(r=> splittedList.Contains(r.key))
   }
   return resultList;
}

然后在您的 UI 上，您可以轻松地按键区分列表，如果需要获取特定列表类型而不是将其作为参数发送

c# - Angular中一个请求和多个请求的性能差异