106. 如何提高 SAP UI5 应用路由 url 的可读性

本教程前一步骤 SAP UI5 应用开发教程之一百零五 - SAP UI5 Master-Detail 布局模式的联动效果实现明细介绍 我们已经实现了一个典型的符合 Master-Detail 页面布局的 SAP UI5 应用，效果如下 gif 动图所示：

这个应用还有很多瑕疵。

比如我们点击列表里第一个行项目，该行项目的产品 id 为 HT-2001, 但是浏览器地址栏 detail 后面的片段为 94，这就非常让用户疑惑了。因为如果这个 94 代表产品索引的话，我们点击了列表第一个行项目，其索引值应该为 0 才对，这个 94 是从什么地方来的？

先介绍下本步骤实现的效果：我们想提高点击行项目之后，渲染的明细页面 url 的可读性。

按照该步骤完成开发后，达成的效果是，点击行项目之后，行项目的产品 id 出现在地址栏里，下面是一个例子：

http://localhost:8080/webapp/index.html#/detail/HT-1000/TwoColumnsMidExpanded