interface.d.ts 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729
  1. /**
  2. * @ng1api
  3. * @module ng1
  4. */ /** */
  5. import { StateDeclaration, _ViewDeclaration, IInjectable, Transition, HookResult } from "@uirouter/core";
  6. /**
  7. * The signature for Angular 1 State Transition Hooks.
  8. *
  9. * State hooks are registered as onEnter/onRetain/onExit in state declarations.
  10. * State hooks can additionally be injected with $transition$ and $state$ for
  11. * the current [[Transition]] and [[StateObject]] in the transition.
  12. *
  13. * Transition State Hooks are callback functions that hook into the lifecycle events of specific states during a transition.
  14. * As a transition runs, it may exit some states, retain (keep) states, and enter states.
  15. * As each lifecycle event occurs, the hooks which are registered for the event and that state are called (in priority order).
  16. *
  17. * #### See also:
  18. *
  19. * - [[IHookRegistry.onExit]]
  20. * - [[IHookRegistry.onRetain]]
  21. * - [[IHookRegistry.onEnter]]
  22. *
  23. * #### Example:
  24. * ```js
  25. * onEnter: function() { console.log('Entering'); }
  26. * ```
  27. *
  28. * Not minification-safe
  29. * ```js
  30. * onRetain: function($state$) { console.log('Retained ' + $state$.name); }
  31. * ```
  32. *
  33. * Annotated for minification-safety
  34. * ```js
  35. * onExit: [ '$transition$', '$state', function($transition$, $state) {
  36. * // always redirect to 'foo' state when being exited
  37. * if ($transition$.to().name !== 'foo') {
  38. * return $state.target('foo');
  39. * }
  40. * } ]
  41. * ```
  42. *
  43. * @returns an optional [[HookResult]] which may alter the transition
  44. */
  45. export interface Ng1StateTransitionHook {
  46. (...injectables: any[]): HookResult;
  47. }
  48. /**
  49. * @internalapi
  50. * an intermediate interface.
  51. *
  52. * Used to reset [[StateDeclaration]] typings to `any` so the [[Ng1StateDeclaration]] interface can then narrow them */
  53. export interface _Ng1StateDeclaration extends StateDeclaration {
  54. onExit?: any;
  55. onRetain?: any;
  56. onEnter?: any;
  57. }
  58. /**
  59. * The StateDeclaration object is used to define a state or nested state.
  60. * It should be registered with the [[StateRegistry]].
  61. *
  62. * #### Example:
  63. * ```js
  64. * // StateDeclaration object
  65. * var foldersState = {
  66. * name: 'folders',
  67. * url: '/folders',
  68. * resolve: {
  69. * allfolders: function(FolderService) {
  70. * return FolderService.list();
  71. * }
  72. * },
  73. * template: "<ul><li ng-repeat='folder in allfolders'>{{folder.name}}</li></ul>",
  74. * controller: function(allfolders, $scope) {
  75. * $scope.allfolders = allfolders;
  76. * }
  77. * }
  78. * ```
  79. *
  80. * Since this interface extends [[Ng1ViewDeclaration]], any view declaration properties can be set directly
  81. * on the state declaration and they will be applied to the view with the name `$default`. For example:
  82. *
  83. * ```js
  84. * var state = {
  85. * name: 'foo',
  86. * url: '/foo',
  87. * template: '<h1>foo</h1>',
  88. * controller: 'FooController'
  89. * }
  90. * ```
  91. *
  92. * is simply syntactic sugar for:
  93. *
  94. * ```js
  95. * var state = {
  96. * name: 'foo',
  97. * url: '/foo',
  98. * views: {
  99. * $default: {
  100. * template: '<h1>foo</h1>',
  101. * controller: 'FooController
  102. * }
  103. * }
  104. * }
  105. * ```
  106. *
  107. * If a state definition contains a `views:` object, any view properties set directly on the state are ignored.
  108. * Thus, this is an invalid state defintion:
  109. *
  110. * ```js
  111. * var state = {
  112. * name: 'foo',
  113. * url: '/foo',
  114. * controller: 'FooController, // invalid because views: exists
  115. * views: {
  116. * header: {
  117. * template: '<h1>header</h1>'
  118. * }
  119. * }
  120. * }
  121. * ```
  122. */
  123. export interface Ng1StateDeclaration extends _Ng1StateDeclaration, Ng1ViewDeclaration {
  124. /**
  125. * An optional object which defines multiple named views.
  126. *
  127. * Each key is the name of a view, and each value is a [[Ng1ViewDeclaration]].
  128. * Unnamed views are internally renamed to `$default`.
  129. *
  130. * A view's name is used to match an active `<ui-view>` directive in the DOM. When the state
  131. * is entered, the state's views are activated and matched with active `<ui-view>` directives:
  132. *
  133. * - The view's name is processed into a ui-view target:
  134. * - ui-view address: an address to a ui-view
  135. * - state anchor: the state to anchor the address to
  136. *
  137. * Examples:
  138. *
  139. * Targets three named ui-views in the parent state's template
  140. *
  141. * #### Example:
  142. * ```js
  143. * views: {
  144. * header: {
  145. * controller: "headerCtrl",
  146. * templateUrl: "header.html"
  147. * },
  148. * body: {
  149. * controller: "bodyCtrl",
  150. * templateUrl: "body.html"
  151. * },
  152. * footer: "footerComponent"
  153. * }
  154. * ```
  155. *
  156. * #### Example:
  157. * ```js
  158. * // Targets named ui-view="header" in the template of the ancestor state 'top'
  159. * // and the named `ui-view="body" from the parent state's template.
  160. * views: {
  161. * 'header@top': {
  162. * controller: "msgHeaderCtrl",
  163. * templateUrl: "msgHeader.html"
  164. * },
  165. * 'body': {
  166. * controller: "messagesCtrl",
  167. * templateUrl: "messages.html"
  168. * }
  169. * }
  170. * ```
  171. *
  172. * ## View targeting details
  173. *
  174. * There are a few styles of view addressing/targeting.
  175. * The most common is a simple `ui-view` name
  176. *
  177. * #### Simple ui-view name
  178. *
  179. * Addresses without an `@` are anchored to the parent state.
  180. *
  181. * #### Example:
  182. * ```js
  183. * // target the `<div ui-view='foo'></div>` created in the parent state's view
  184. * views: {
  185. * foo: {...}
  186. * }
  187. * ```
  188. *
  189. * #### View name anchored to a state
  190. *
  191. * You can anchor the `ui-view` name to a specific state by including an `@`
  192. *
  193. * #### Example:
  194. * targets the `<div ui-view='foo'></div>` which was created in a view owned by the state `bar.baz`
  195. * ```js
  196. * views: {
  197. * 'foo@bar.baz': {...}
  198. * }
  199. * ```
  200. *
  201. * #### Absolute addressing
  202. *
  203. * You can address a `ui-view` absolutely, using dotted notation, by prefixing the address with a `!`.
  204. * Dotted addresses traverse the hierarchy of `ui-view`s active in the DOM:
  205. *
  206. * #### Example:
  207. * absolutely targets the `<div ui-view='nested'></div>`
  208. * ... which was created in the unnamed/$default root `<ui-view></ui-view>`
  209. * ```js
  210. * views: {
  211. * '!$default.nested': {...}
  212. * }
  213. * ```
  214. *
  215. * #### Relative addressing
  216. *
  217. * Absolute addressing is actually relative addressing, anchored to the unnamed root state (`""`).
  218. * You can also use relative addressing anchored to *any state*, in order to target a target deeply nested `ui-views`:
  219. * The `ui-view` is targeted relative to the anchored state by traversing the nested `ui-view` names.
  220. *
  221. * #### Example:
  222. * targets the `<div ui-view='bar'></div>`
  223. * ... which was created inside the
  224. * `<div ui-view='foo'></div>`
  225. * ... which was created inside the parent state's template.
  226. * ```js
  227. * views: {
  228. * 'foo.bar': {...}
  229. * }
  230. * ```
  231. *
  232. * #### Example:
  233. * targets the `<div ui-view='bar'></div>`
  234. * ... which was created in `<div ui-view='foo'></div>`
  235. * ... which was created in a template from the state `baz.qux`
  236. * ```js
  237. * views: {
  238. * 'foo.bar@baz.qux': {...}
  239. * }
  240. * ```
  241. *
  242. * #### Example:
  243. * a view can relatively target a named `ui-view` defined on an ancestor using `^` (meaning "parent")
  244. * ```js
  245. * views: {
  246. * 'foo@^': {...}, // foo@(parent state) (same as simply 'foo')
  247. * 'bar@^.^': {...}, // bar@(grandparent state)
  248. * 'baz@^.^.^': {...}, // baz@(great-grandparent state)
  249. * }
  250. * ```
  251. *
  252. * For additional in-depth details about how `ui-view` addressing works, see the internal api [[ViewService.match]].
  253. *
  254. * ---
  255. *
  256. * ## State template+controller and `views:` incompatiblity
  257. *
  258. * If a state has a `views` object, any state-level view properties ([[Ng1ViewDeclaration]]) are ignored. Therefore,
  259. * if _any view_ for a state is declared in the `views` object, then _all of the state's views_ must be defined in
  260. * the `views` object. The state declaration must not have any of the following fields:
  261. * - component
  262. * - bindings
  263. * - resolveAs
  264. * - template
  265. * - templateUrl
  266. * - templateProvider
  267. * - controller
  268. * - controllerAs
  269. * - controllerProvider
  270. */
  271. views?: {
  272. [key: string]: Ng1ViewDeclaration;
  273. };
  274. /**
  275. * A state hook invoked when a state is being entered.
  276. *
  277. * The hook can inject global services.
  278. * It can also inject `$transition$` or `$state$` (from the current transition).
  279. *
  280. * ### Example:
  281. * ```js
  282. * $stateProvider.state({
  283. * name: 'mystate',
  284. * onEnter: (MyService, $transition$, $state$) => {
  285. * return MyService.doSomething($state$.name, $transition$.params());
  286. * }
  287. * });
  288. * ```
  289. *
  290. * #### Example:`
  291. * ```js
  292. * $stateProvider.state({
  293. * name: 'mystate',
  294. * onEnter: [ 'MyService', '$transition$', '$state$', function (MyService, $transition$, $state$) {
  295. * return MyService.doSomething($state$.name, $transition$.params());
  296. * } ]
  297. * });
  298. * ```
  299. */
  300. onEnter?: Ng1StateTransitionHook | IInjectable;
  301. /**
  302. * A state hook invoked when a state is being exited.
  303. *
  304. * The hook can inject global services.
  305. * It can also inject `$transition$` or `$state$` (from the current transition).
  306. *
  307. * ### Example:
  308. * ```js
  309. * $stateProvider.state({
  310. * name: 'mystate',
  311. * onExit: (MyService, $transition$, $state$) => {
  312. * return MyService.doSomething($state$.name, $transition$.params());
  313. * }
  314. * });
  315. * ```
  316. *
  317. * #### Example:`
  318. * ```js
  319. * $stateProvider.state({
  320. * name: 'mystate',
  321. * onExit: [ 'MyService', '$transition$', '$state$', function (MyService, $transition$, $state$) {
  322. * return MyService.doSomething($state$.name, $transition$.params());
  323. * } ]
  324. * });
  325. * ```
  326. */
  327. onExit?: Ng1StateTransitionHook | IInjectable;
  328. /**
  329. * A state hook invoked when a state is being retained.
  330. *
  331. * The hook can inject global services.
  332. * It can also inject `$transition$` or `$state$` (from the current transition).
  333. *
  334. * #### Example:
  335. * ```js
  336. * $stateProvider.state({
  337. * name: 'mystate',
  338. * onRetain: (MyService, $transition$, $state$) => {
  339. * return MyService.doSomething($state$.name, $transition$.params());
  340. * }
  341. * });
  342. * ```
  343. *
  344. * #### Example:`
  345. * ```js
  346. * $stateProvider.state({
  347. * name: 'mystate',
  348. * onRetain: [ 'MyService', '$transition$', '$state$', function (MyService, $transition$, $state$) {
  349. * return MyService.doSomething($state$.name, $transition$.params());
  350. * } ]
  351. * });
  352. * ```
  353. */
  354. onRetain?: Ng1StateTransitionHook | IInjectable;
  355. /**
  356. * Makes all search/query parameters `dynamic`
  357. *
  358. * ### Deprecation warning: use [[ParamDeclaration.dynamic]] instead
  359. *
  360. * @deprecated
  361. */
  362. reloadOnSearch?: boolean;
  363. }
  364. export interface Ng1ViewDeclaration extends _ViewDeclaration {
  365. /**
  366. * The name of the component to use for this view.
  367. *
  368. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  369. *
  370. * The name of an [angular 1.5+ `.component()`](https://docs.angularjs.org/guide/component) (or directive with
  371. * bindToController and/or scope declaration) which will be used for this view.
  372. *
  373. * Resolve data can be provided to the component via the component's `bindings` object (for 1.3+ directives, the
  374. * `bindToController` is used; for other directives, the `scope` declaration is used). For each binding declared
  375. * on the component, any resolve with the same name is set on the component's controller instance. The binding
  376. * is provided to the component as a one-time-binding. In general, components should likewise declare their
  377. * input bindings as [one-way ("&lt;")](https://docs.angularjs.org/api/ng/service/$compile#-scope-).
  378. *
  379. * Note: inside a "views:" block, a bare string `"foo"` is shorthand for `{ component: "foo" }`
  380. *
  381. * Note: Mapping from resolve names to component inputs may be specified using [[bindings]].
  382. *
  383. * #### Example:
  384. * ```js
  385. * .state('profile', {
  386. * // Use the <my-profile></my-profile> component for the Unnamed view
  387. * component: 'MyProfile',
  388. * }
  389. *
  390. * .state('messages', {
  391. * // use the <nav-bar></nav-bar> component for the view named 'header'
  392. * // use the <message-list></message-list> component for the view named 'content'
  393. * views: {
  394. * header: { component: 'NavBar' },
  395. * content: { component: 'MessageList' }
  396. * }
  397. * }
  398. *
  399. * .state('contacts', {
  400. * // Inside a "views:" block, a bare string "NavBar" is shorthand for { component: "NavBar" }
  401. * // use the <nav-bar></nav-bar> component for the view named 'header'
  402. * // use the <contact-list></contact-list> component for the view named 'content'
  403. * views: {
  404. * header: 'NavBar',
  405. * content: 'ContactList'
  406. * }
  407. * }
  408. * ```
  409. *
  410. *
  411. * Note: When using `component` to define a view, you may _not_ use any of: `template`, `templateUrl`,
  412. * `templateProvider`, `controller`, `controllerProvider`, `controllerAs`.
  413. *
  414. *
  415. * See also: Todd Motto's angular 1.3 and 1.4 [backport of .component()](https://github.com/toddmotto/angular-component)
  416. */
  417. component?: string;
  418. /**
  419. * An object which maps `resolve`s to [[component]] `bindings`.
  420. *
  421. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  422. *
  423. * When using a [[component]] declaration (`component: 'myComponent'`), each input binding for the component is supplied
  424. * data from a resolve of the same name, by default. You may supply data from a different resolve name by mapping it here.
  425. *
  426. * Each key in this object is the name of one of the component's input bindings.
  427. * Each value is the name of the resolve that should be provided to that binding.
  428. *
  429. * Any component bindings that are omitted from this map get the default behavior of mapping to a resolve of the
  430. * same name.
  431. *
  432. * #### Example:
  433. * ```js
  434. * $stateProvider.state('foo', {
  435. * resolve: {
  436. * foo: function(FooService) { return FooService.get(); },
  437. * bar: function(BarService) { return BarService.get(); }
  438. * },
  439. * component: 'Baz',
  440. * // The component's `baz` binding gets data from the `bar` resolve
  441. * // The component's `foo` binding gets data from the `foo` resolve (default behavior)
  442. * bindings: {
  443. * baz: 'bar'
  444. * }
  445. * });
  446. *
  447. * app.component('Baz', {
  448. * templateUrl: 'baz.html',
  449. * controller: 'BazController',
  450. * bindings: {
  451. * foo: '<', // foo binding
  452. * baz: '<' // baz binding
  453. * }
  454. * });
  455. * ```
  456. *
  457. */
  458. bindings?: {
  459. [key: string]: string;
  460. };
  461. /**
  462. * Dynamic component provider function.
  463. *
  464. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  465. *
  466. * This is an injectable provider function which returns the name of the component to use.
  467. * The provider will invoked during a Transition in which the view's state is entered.
  468. * The provider is called after the resolve data is fetched.
  469. *
  470. * #### Example:
  471. * ```js
  472. * componentProvider: function(MyResolveData, $transition$) {
  473. * if (MyResolveData.foo) {
  474. * return "fooComponent"
  475. * } else if ($transition$.to().name === 'bar') {
  476. * return "barComponent";
  477. * }
  478. * }
  479. * ```
  480. */
  481. componentProvider?: IInjectable;
  482. /**
  483. * The view's controller function or name
  484. *
  485. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  486. *
  487. * The controller function, or the name of a registered controller. The controller function will be used
  488. * to control the contents of the [[directives.uiView]] directive.
  489. *
  490. * If specified as a string, controllerAs can be declared here, i.e., "FooController as foo" instead of in
  491. * a separate [[controllerAs]] property.
  492. *
  493. * See: [[Ng1Controller]] for information about component-level router hooks.
  494. */
  495. controller?: (IInjectable | string);
  496. /**
  497. * A controller alias name.
  498. *
  499. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  500. *
  501. * If present, the controller will be published to scope under the `controllerAs` name.
  502. * See: https://docs.angularjs.org/api/ng/directive/ngController
  503. */
  504. controllerAs?: string;
  505. /**
  506. * Dynamic controller provider function.
  507. *
  508. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  509. *
  510. * This is an injectable provider function which returns the actual controller function, or the name
  511. * of a registered controller. The provider will invoked during a Transition in which the view's state is
  512. * entered. The provider is called after the resolve data is fetched.
  513. *
  514. * #### Example:
  515. * ```js
  516. * controllerProvider: function(MyResolveData, $transition$) {
  517. * if (MyResolveData.foo) {
  518. * return "FooCtrl"
  519. * } else if ($transition$.to().name === 'bar') {
  520. * return "BarCtrl";
  521. * } else {
  522. * return function($scope) {
  523. * $scope.baz = "Qux";
  524. * }
  525. * }
  526. * }
  527. * ```
  528. */
  529. controllerProvider?: IInjectable;
  530. /**
  531. * The scope variable name to use for resolve data.
  532. *
  533. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  534. *
  535. * When a view is activated, the resolved data for the state which the view belongs to is put on the scope.
  536. * This property sets the name of the scope variable to use for the resolved data.
  537. *
  538. * Defaults to `$resolve`.
  539. */
  540. resolveAs?: string;
  541. /**
  542. * The HTML template for the view.
  543. *
  544. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  545. *
  546. * HTML template as a string, or a function which returns an html template as a string.
  547. * This template will be used to render the corresponding [[directives.uiView]] directive.
  548. *
  549. * This property takes precedence over templateUrl.
  550. *
  551. * If `template` is a function, it will be called with the Transition parameters as the first argument.
  552. *
  553. * #### Example:
  554. * ```js
  555. * template: "<h1>inline template definition</h1><div ui-view></div>"
  556. * ```
  557. *
  558. * #### Example:
  559. * ```js
  560. * template: function(params) {
  561. * return "<h1>generated template</h1>";
  562. * }
  563. * ```
  564. */
  565. template?: (Function | string);
  566. /**
  567. * The URL for the HTML template for the view.
  568. *
  569. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  570. *
  571. * A path or a function that returns a path to an html template.
  572. * The template will be fetched and used to render the corresponding [[directives.uiView]] directive.
  573. *
  574. * If `templateUrl` is a function, it will be called with the Transition parameters as the first argument.
  575. *
  576. * #### Example:
  577. * ```js
  578. * templateUrl: "/templates/home.html"
  579. * ```
  580. *
  581. * #### Example:
  582. * ```js
  583. * templateUrl: function(params) {
  584. * return myTemplates[params.pageId];
  585. * }
  586. * ```
  587. */
  588. templateUrl?: (string | Function);
  589. /**
  590. * Injected function which returns the HTML template.
  591. *
  592. * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
  593. *
  594. * Injected function which returns the HTML template.
  595. * The template will be used to render the corresponding [[directives.uiView]] directive.
  596. *
  597. * #### Example:
  598. * ```js
  599. * templateProvider: function(MyTemplateService, $transition$) {
  600. * return MyTemplateService.getTemplate($transition$.params().pageId);
  601. * }
  602. * ```
  603. */
  604. templateProvider?: IInjectable;
  605. }
  606. /**
  607. * The shape of a controller for a view (and/or component), defining the controller callbacks.
  608. *
  609. * A view in UI-Router is comprised of either a `component` ([[Ng1ViewDeclaration.component]]) or a combination of a
  610. * `template` (or `templateProvider`) and a `controller` (or `controllerProvider`).
  611. *
  612. * The `controller` object (or the `component`'s controller object) can define component-level controller callbacks,
  613. * which UI-Router will call at the appropriate times. These callbacks are similar to Transition Hooks
  614. * ([[IHookRegistry]]), but are only called if the view is currently active.
  615. *
  616. * This interface defines the UI-Router component callbacks.
  617. *
  618. */
  619. export interface Ng1Controller {
  620. /** @hidden */
  621. $onInit(): void;
  622. /**
  623. * This callback is called when parameter values have changed.
  624. *
  625. * This callback can be used to respond to changing parameter values in the current state, or in parent/child states.
  626. * This callback is especially handy when using dynamic parameters ([[ParamDeclaration.dynamic]])
  627. *
  628. * Called when:
  629. * - The view is still active
  630. * - A new transition has completed successfully
  631. * - The state for the view (controller) was not reloaded
  632. * - At least one parameter value was changed
  633. *
  634. * Called with:
  635. * @param newValues an object containing the changed parameter values
  636. * @param $transition$ the new Transition which triggered this callback
  637. *
  638. * #### Example:
  639. * ```js
  640. * angular.module('foo').controller('FancyCtrl', function() {
  641. * this.uiOnParamsChanged = function(newParams) {
  642. * console.log("new params: ", newParams);
  643. * }
  644. * });
  645. * ```
  646. */
  647. uiOnParamsChanged(newValues: any, $transition$: Transition): void;
  648. /**
  649. * This callback is called when the view's state is about to be exited.
  650. *
  651. * This callback is used to inform a view that it is about to be exited, due to a new [[Transition]].
  652. * The callback can ask for user confirmation, and cancel or alter the new Transition. The callback should
  653. * return a value, or a promise for a value. If a promise is returned, the new Transition waits until the
  654. * promise settles.
  655. *
  656. *
  657. * Called when:
  658. * - The view is still active
  659. * - A new Transition is about to run
  660. * - The new Transition will exit the view's state
  661. *
  662. * Called with:
  663. * - The new Transition
  664. *
  665. * Relevant return Values:
  666. * - `false`: The transition is cancelled.
  667. * - A rejected promise: The transition is cancelled.
  668. * - [[TargetState]]: The transition is redirected to the new target state.
  669. * - Anything else: the transition will continue normally (the state and view will be deactivated)
  670. *
  671. * #### Example:
  672. * ```js
  673. * app.component('myComponent', {
  674. * template: '<input ng-model="$ctrl.data" type="text">',
  675. * bindings: { 'data': '<' },
  676. * controller: function() {
  677. *
  678. * this.originalData = angular.copy(this.data);
  679. *
  680. * this.uiCanExit = function() {
  681. * if (!angular.equals(this.data, this.originalData) {
  682. * // Note: This could also return a Promise and request async
  683. * // confirmation using something like ui-bootstrap $modal
  684. * return window.confirm("Data has changed. Exit anyway and lose changes?");
  685. * }
  686. * }
  687. * }
  688. * }
  689. * ```
  690. *
  691. * @param transition the new Transition that is about to exit the component's state
  692. * @return a HookResult, or a promise for a HookResult
  693. */
  694. uiCanExit(transition: Transition): HookResult;
  695. }
  696. /**
  697. * Manages which template-loading mechanism to use.
  698. *
  699. * Defaults to `$templateRequest` on Angular versions starting from 1.3, `$http` otherwise.
  700. */
  701. export interface TemplateFactoryProvider {
  702. /**
  703. * Forces $templateFactory to use $http instead of $templateRequest.
  704. *
  705. * UI-Router uses `$templateRequest` by default on angular 1.3+.
  706. * Use this method to choose to use `$http` instead.
  707. *
  708. * ---
  709. *
  710. * ## Security warning
  711. *
  712. * This might cause XSS, as $http doesn't enforce the regular security checks for
  713. * templates that have been introduced in Angular 1.3.
  714. *
  715. * See the $sce documentation, section
  716. * <a href="https://docs.angularjs.org/api/ng/service/$sce#impact-on-loading-templates">
  717. * Impact on loading templates</a> for more details about this mechanism.
  718. *
  719. * *Note: forcing this to `false` on Angular 1.2.x will crash, because `$templateRequest` is not implemented.*
  720. *
  721. * @param useUnsafeHttpService `true` to use `$http` to fetch templates
  722. */
  723. useHttpService(useUnsafeHttpService: boolean): any;
  724. }
  725. declare module "@uirouter/core/lib/state/stateRegistry" {
  726. interface StateRegistry {
  727. register(state: Ng1StateDeclaration): any;
  728. }
  729. }