我有一个URL,允许我过滤课程列表.这是URL的格式:
www.xxxxx /#/滤波器/所有课程/语言-全全部/全全部/小时(S)/全部/全部/全部/任何/ 1
通过这个网址,我想要的课程列表包含Course
as type
,Languages
as Category
和duration
inhour(s)
这是客户端应用程序的URL(用...编写Angular.js
).我所做的是阅读网址中的参数并打电话给网络服务,该网络服务将为我提供给定生物的课程列表.
这个URL很难看,因为它包含很多"所有"通配符(客户端不喜欢它).
我想删除"全部"关键字.我面临的问题是,我将不再知道哪个关键字与哪种类型的过滤器相关.第二个问题是这个URL可以发送给另一个人(另一个浏览器),我应该得到与第一个浏览器相同的结果.
我看到的解决方案(希望它不是唯一的)将过滤器作为键值,url将如下所示:
/过滤/类型:课程/类别:语言....
这在少量滤波器中是好的,但是在大量滤波器的情况下很长(我有12个).理想的解决方案是拥有这样的URL:
器/过滤器/场/语言....
有什么线索我怎么能做到这一点?
您可以通过将网址段与唯一的正则表达式模式匹配来使用过滤来实现类似http://www.springest.co.uk/agriculture-horticulture/animal-care的内容.例如,它们daytime
用于日间过滤器,因为它与任何其他过滤器不匹配,而对于职业级别过滤器,它们使用职业级别[2-4] ......
因此,我们的想法是确定仅匹配唯一过滤器的模式,然后进行匹配并激活每个过滤器.在您的情况下,如果我们做出以下假设:
course
或other
和被保留值没有过滤器可以匹配它们.language-
我们知道过滤器匹配单个模式,如果一个段是数字它是小时,如果从语言开始它是语言,如果是课程或其他类型.然后你的逻辑看起来像这样:
var App = angular.module('App', ['ngRoute']);
var patterns = {
type: /(course|other)/,
hours: /([0-9]+)/,
language: /language-(.*)/,
};
App.config(function ($routeProvider) {
$routeProvider
.when('/filter/:filter*', {templateUrl: 'aa.html', controller: 'FilterCtrl'})
.otherwise({redirectTo: '/'});
});
App.controller('FilterCtrl', function ($routeParams, $location) {
var segments = $routeParams.filter.split('/');
segments.forEach(function (el) {
for (var filter in patterns) {
var res = el.match(patterns[filter]);
if (res !== null) {
console.log("Activate filter ", filter, " with params", res[1]);
}
}
});
});
Run Code Online (Sandbox Code Playgroud)
这种方法使过滤非常灵活,因此您可以更改过滤器顺序,也可以像网站一样轻松删除或添加新过滤器.
你应该注意将来可能发生的变化,如果业务逻辑或命名约定的修改会破坏过滤器,那么明智地选择模式,希望我帮助.
归档时间: |
|
查看次数: |
165 次 |
最近记录: |