a zip code crypto-currency system good for red ONLY

ionic-page.d.ts 9.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
  1. /**
  2. * @hidden
  3. * public link interface
  4. */
  5. export interface IonicPageMetadata {
  6. name?: string;
  7. segment?: string;
  8. defaultHistory?: string[];
  9. priority?: string;
  10. }
  11. /**
  12. * @name IonicPage
  13. * @description
  14. * The Ionic Page handles registering and displaying specific pages based on URLs. It's used
  15. * underneath `NavController` so it will never have to be interacted with directly. When a new
  16. * page is pushed with `NavController`, the URL is updated to match the path to this page.
  17. *
  18. * Unlike traditional web apps, URLs don't dictate navigation in Ionic apps.
  19. * Instead, URLs help us link to specific pieces of content as a breadcrumb.
  20. * The current URL gets updated as we navigate, but we use the `NavController`
  21. * push and pop, or `NavPush` and `NavPop` to move around. This makes it much easier
  22. * to handle complicated nested navigation.
  23. *
  24. * We refer to our URL system as a deep link system instead of a router to encourage
  25. * Ionic developers to think of URLs as a breadcrumb rather than as the source of
  26. * truth in navigation. This encourages flexible navigation design and happy apps all
  27. * over the world.
  28. *
  29. *
  30. * @usage
  31. *
  32. * The first step to setting up deep links is to add the page that should be
  33. * a deep link in the `IonicPageModule.forChild` import of the page's module.
  34. * For our examples, this will be `MyPage`:
  35. *
  36. * ```ts
  37. * @NgModule({
  38. * declarations: [
  39. * MyPage
  40. * ],
  41. * imports: [
  42. * IonicPageModule.forChild(MyPage)
  43. * ],
  44. * entryComponents: [
  45. * MyPage
  46. * ]
  47. * })
  48. * export class MyPageModule {}
  49. * ```
  50. *
  51. * Then, add the `@IonicPage` decorator to the component. The most simple usage is adding an
  52. * empty decorator:
  53. *
  54. * ```ts
  55. * @IonicPage()
  56. * @Component({
  57. * templateUrl: 'main.html'
  58. * })
  59. * export class MyPage {}
  60. * ```
  61. *
  62. * This will automatically create a link to the `MyPage` component using the same name as the class,
  63. * `name`: `'MyPage'`. The page can now be navigated to by using this name. For example:
  64. *
  65. * ```ts
  66. * @Component({
  67. * templateUrl: 'another-page.html'
  68. * })
  69. * export class AnotherPage {
  70. * constructor(public navCtrl: NavController) {}
  71. *
  72. * goToMyPage() {
  73. * // go to the MyPage component
  74. * this.navCtrl.push('MyPage');
  75. * }
  76. * }
  77. * ```
  78. *
  79. * The `@IonicPage` decorator accepts a `DeepLinkMetadataType` object. This object accepts
  80. * the following properties: `name`, `segment`, `defaultHistory`, and `priority`. All of them
  81. * are optional but can be used to create complex navigation links.
  82. *
  83. *
  84. * ### Changing Name
  85. *
  86. * As mentioned previously, the `name` property will be set to the class name if it isn't provided.
  87. * Changing the name of the link is extremely simple. To change the name used to link to the
  88. * component, simply pass it in the decorator like so:
  89. *
  90. * ```ts
  91. * @IonicPage({
  92. * name: 'my-page'
  93. * })
  94. * ```
  95. *
  96. * This will create a link to the `MyPage` component using the name `'my-page'`. Similar to the previous
  97. * example, the page can be navigated to by using the name:
  98. *
  99. * ```ts
  100. * goToMyPage() {
  101. * // go to the MyPage component
  102. * this.navCtrl.push('my-page');
  103. * }
  104. * ```
  105. *
  106. *
  107. * ### Setting URL Path
  108. *
  109. * The `segment` property is used to set the URL to the page. If this property isn't provided, the
  110. * `segment` will use the value of `name`. Since components can be loaded anywhere in the app, the
  111. * `segment` doesn't require a full URL path. When a page becomes the active page, the `segment` is
  112. * appended to the URL.
  113. *
  114. * The `segment` can be changed to anything and doesn't have to match the `name`. For example, passing
  115. * a value for `name` and `segment`:
  116. *
  117. * ```ts
  118. * @IonicPage({
  119. * name: 'my-page',
  120. * segment: 'some-path'
  121. * })
  122. * ```
  123. *
  124. * When navigating to this page as the first page in the app, the URL will look something like:
  125. *
  126. * ```
  127. * http://localhost:8101/#/some-path
  128. * ```
  129. *
  130. * However, navigating to the page will still use the `name` like the previous examples do.
  131. *
  132. *
  133. * ### Dynamic Links
  134. *
  135. * The `segment` property is useful for creating dynamic links. Sometimes the URL isn't known ahead
  136. * of time, so it can be passed as a variable.
  137. *
  138. * Since passing data around is common practice in an app, it can be reflected in the app's URL by
  139. * using the `:param` syntax. For example, set the `segment` in the `@IonicPage` decorator:
  140. *
  141. * ```ts
  142. * @IonicPage({
  143. * name: 'detail-page',
  144. * segment: 'detail/:id'
  145. * })
  146. * ```
  147. *
  148. * In this case, when we `push` to a new instance of `'detail-page'`, the value of `id` will
  149. * in the `detailInfo` data being passed to `push` will replace `:id` in the URL.
  150. *
  151. * Important: The property needs to be something that can be converted into a string, objects
  152. * are not supported.
  153. *
  154. * For example, to push the `'detail-page'` in the `ListPage` component, the following code could
  155. * be used:
  156. *
  157. * ```ts
  158. * @IonicPage({
  159. * name: 'list'
  160. * })
  161. * export class ListPage {
  162. * constructor(public navCtrl: NavController) {}
  163. *
  164. * pushPage(detailInfo) {
  165. * // Push an `id` to the `'detail-page'`
  166. * this.navCtrl.push('detail-page', {
  167. * 'id': detailInfo.id
  168. * })
  169. * }
  170. * }
  171. * ```
  172. *
  173. * If the value of `detailInfo.id` is `12`, for example, the URL would end up looking like this:
  174. *
  175. * ```
  176. * http://localhost:8101/#/list/detail/12
  177. * ```
  178. *
  179. * Since this `id` will be used to pull in the data of the specific detail page, it's Important
  180. * that the `id` is unique.
  181. *
  182. * Note: Even though the `name` is `detail-page`, the `segment` uses `detail/:id`, and the URL
  183. * will use the `segment`.
  184. *
  185. *
  186. * ### Default History
  187. *
  188. * Pages can be navigated to using deep links from anywhere in the app, but sometimes the app is
  189. * launched from a URL and the page needs to have the same history as if it were navigated to from
  190. * inside of the app.
  191. *
  192. * By default, the page would be navigated to as the first page in the stack with no prior history.
  193. * A good example is the App Store on iOS. Clicking on a URL to an application in the App Store will
  194. * load the details of the application with no back button, as if it were the first page ever viewed.
  195. *
  196. * The default history of any page can be set in the `defaultHistory` property. This history will only
  197. * be used if the history doesn't already exist, meaning if you navigate to the page the history will
  198. * be the pages that were navigated from.
  199. *
  200. * The `defaultHistory` property takes an array of page names. The page names are specified as statically
  201. * analyzable strings (which means you must use strings and not variables or delared constants). If the
  202. * parent page does not have a `name` specified in its `IonicPage` decorator its name is its class name.
  203. *
  204. * For example, setting the history of the detail page to the list page where the `name` is `list`:
  205. *
  206. * ```ts
  207. * @IonicPage({
  208. * name: 'detail-page',
  209. * segment: 'detail/:id',
  210. * defaultHistory: ['list']
  211. * })
  212. * ```
  213. *
  214. * In this example, if the app is launched at `http://localhost:8101/#/detail/my-detail` the displayed page
  215. * will be the `'detail-page'` with an id of `my-detail` and it will show a back button that goes back to
  216. * the `'list'` page.
  217. *
  218. * For a deeper example:
  219. *
  220. * ```ts
  221. * @IonicPage({
  222. * segment: 'contact-more-info',
  223. * defaultHistory: ['ContactDetailPage', 'Contact']
  224. * })
  225. * ...
  226. * export class ContactMoreInfoPage {
  227. * ...
  228. * }
  229. * ```
  230. *
  231. * In this example, if the app is launched at `http://localhost:8101/#/contact/contact-more-info` the displayed page
  232. * will be the `'ContactMoreInfoPage'`. It will show a back button that will go to the `'ContactDetailPage'` which
  233. * will also show a back button which will go to the `'Constact'` page.
  234. *
  235. * An example of an application with a set history stack is the Instagram application. Opening a link
  236. * to an image on Instagram will show the details for that image with a back button to the user's profile
  237. * page. There is no "right" way of setting the history for a page, it is up to the application.
  238. *
  239. * ### Priority
  240. *
  241. * The `priority` property is only used during preloading. By default, preloading is turned off so setting
  242. * this property would do nothing. Preloading eagerly loads all deep links after the application boots
  243. * instead of on demand as needed. To enable preloading, set `preloadModules` in the main application module
  244. * config to `true`:
  245. *
  246. * ```ts
  247. * @NgModule({
  248. * declarations: [
  249. * MyApp
  250. * ],
  251. * imports: [
  252. * BrowserModule,
  253. * IonicModule.forRoot(MyApp, {
  254. * preloadModules: true
  255. * })
  256. * ],
  257. * bootstrap: [IonicApp],
  258. * entryComponents: [
  259. * MyApp
  260. * ]
  261. * })
  262. * export class AppModule { }
  263. * ```
  264. *
  265. * If preloading is turned on, it will load the modules based on the value of `priority`. The following
  266. * values are possible for `priority`: `"high"`, `"low"`, and `"off"`. When there is no `priority`, it
  267. * will be set to `"low"`.
  268. *
  269. * All deep links with their priority set to `"high"` will be loaded first. Upon completion of loading the
  270. * `"high"` priority modules, all deep links with a priority of `"low"` (or no priority) will be loaded. If
  271. * the priority is set to `"off"` the link will not be preloaded. Setting the `priority` is as simple as
  272. * passing it to the `@IonicPage` decorator:
  273. *
  274. * ```ts
  275. * @IonicPage({
  276. * name: 'my-page',
  277. * priority: 'high'
  278. * })
  279. * ```
  280. *
  281. * We recommend setting the `priority` to `"high"` on the pages that will be viewed first when launching
  282. * the application.
  283. *
  284. */
  285. export declare function IonicPage(_config?: IonicPageMetadata): ClassDecorator;