@bennerinformatics/ember-fw-gc

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>FwAppLink - Ember-FW-GC</title> <meta name="description" content="A set of components, controllers, routes, and helpers used in all FW Kit applications."> <link rel="stylesheet" href="http://yui.yahooapis.com/3.9.1/build/cssgrids/cssgrids-min.css"> <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css"> <link rel="stylesheet" href="../assets/css/main.css" id="site_styles"> <link rel="stylesheet" href="../assets/css/custom.css"> <link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.css"> <link rel="stylesheet" href="../assets/vendor/font-awesome/css/font-awesome.min.css"> <link rel="stylesheet" href="../assets/css/theme.css"> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700' rel='stylesheet' type='text/css'>  <link rel="apple-touch-icon" sizes="57x57" href="/assets/icons/apple-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="/assets/icons/apple-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="/assets/icons/apple-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="/assets/icons/apple-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="/assets/icons/apple-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="/assets/icons/apple-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="/assets/icons/apple-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="/assets/icons/apple-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="/assets/icons/apple-icon-180x180.png"> <link rel="icon" type="image/png" sizes="192x192" href="/assets/icons/android-icon-192x192.png"> <link rel="icon" type="image/png" sizes="32x32" href="/assets/icons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="/assets/icons/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="16x16" href="/assets/icons/favicon-16x16.png"> <link rel="manifest" href="/assets/icons/manifest.json"> <meta name="msapplication-TileImage" content="/assets/icons/ms-icon-144x144.png"> <style> body a { color: #7E3DB7; } body a:hover { color: #7E3DB7; opacity: 0.5; } .navbar.navbar-default .navbar-nav> li> a:focus, .navbar.navbar-default .navbar-nav> li> a:hover { color: #7E3DB7; } .navbar.navbar-default .navbar-nav> .active> a, .navbar.navbar-default .navbar-nav> .active> a:focus, .navbar.navbar-default .navbar-nav> .active> a:hover { color: #7E3DB7; } #docs-main .page-header { color: #7E3DB7; } #docs-main .page-section .nav-tabs { border-bottom: 1px solid #7E3DB7; } #docs-main .page-section .nav-tabs> li.active a { background: #7E3DB7; border: 1px solid #7E3DB7; } #sidebar li.panel .panel-body ol> li.active, #sidebar li.panel .panel-body ol> li:hover { background: #efefef; } </style> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <a href="../" class="navbar-brand"> <img src="..\assets\img\fw-logo.png" alt="enterprise logo"> <span>Ember-FW-GC (API)</span> </a> </div> <div class="collapse navbar-collapse" id="nav"> <ul class="nav navbar-nav navbar-right"> <li><a href="https://linformatics.bitbucket.io/docs/">Docs</a></li> <li><a href="https://linformatics.bitbucket.io/downloads/">Downloads</a></li> <li><a href="https://linformatics.bitbucket.io/api/">API</a></li> <li><a href="https://bitbucket.org/linformatics/ember-fw-gc" class="fa fa-github github"></a></li> </ul> </div> </div> </nav> <div id="main-wrapper" class="row"> <div id="content-wrapper"> <ol class="panel-group" id="sidebar" role="tablist" aria-multiselectable="true"> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-search-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-search" aria-expanded="true" aria-controls="collapseOne"> Search </a> </h4> </div> <div id="sidebar-search" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-search-heading"> <div class="panel-body"> <div id="api-tabview-filter"> <input type="search" id="api-filter" placeholder="Search..."> </div> </div> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-version-heading"> <h4 class="panel-title"> <a role="button" href="https://bitbucket.org/linformatics/ember-fw-gc/commits/5e99b10c" target="_blank"> Tag: 2.1.16.5e99b10c </a> </h4> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-modules-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-modules" aria-expanded="true" aria-controls="collapseOne"> Modules </a> </h4> </div> <div id="sidebar-modules" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-modules-heading"> <div class="panel-body"> <ol> <li> <a href="../modules/Components.html">Components</a> </li> <li> <a href="../modules/Helpers.html">Helpers</a> </li> <li> <a href="../modules/Introduction.html">Introduction</a> </li> <li> <a href="../modules/Miscellaneous.html">Miscellaneous</a> </li> <li> <a href="../modules/Mixins.html">Mixins</a> </li> <li> <a href="../modules/Models.html">Models</a> </li> <li> <a href="../modules/Pages.html">Pages</a> </li> <li> <a href="../modules/Services.html">Services</a> </li> <li> <a href="../modules/Utils.html">Utils</a> </li> </ol> </div> </div> </li> <li class="panel panel-default"> <div class="panel-heading" role="tab" id="sidebar-classes-heading"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" href="#sidebar-classes" aria-expanded="true" aria-controls="collapseOne"> Classes </a> </h4> </div> <div id="sidebar-classes" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="sidebar-classes-heading"> <div class="panel-body"> <ol> <li> <a href="../classes/AboutAppModal.html">AboutAppModal</a> </li> <li> <a href="../classes/AjaxService.html">AjaxService</a> </li> <li> <a href="../classes/ApplicationControllerMixin.html">ApplicationControllerMixin</a> </li> <li> <a href="../classes/AppMeta.html">AppMeta</a> </li> <li> <a href="../classes/AppMetaService.html">AppMetaService</a> </li> <li> <a href="../classes/AppSwitchModal.html">AppSwitchModal</a> </li> <li> <a href="../classes/AuthBlock.html">AuthBlock</a> </li> <li> <a href="../classes/AuthButton.html">AuthButton</a> </li> <li> <a href="../classes/AuthCheckMixin.html">AuthCheckMixin</a> </li> <li> <a href="../classes/AuthComponentMixin.html">AuthComponentMixin</a> </li> <li> <a href="../classes/AuthRoute.html">AuthRoute</a> </li> <li> <a href="../classes/AuthRoute-Addon.html">AuthRoute-Addon</a> </li> <li> <a href="../classes/AuthRouteMixin.html">AuthRouteMixin</a> </li> <li> <a href="../classes/ChangePasswordModal.html">ChangePasswordModal</a> </li> <li> <a href="../classes/ConfigService.html">ConfigService</a> </li> <li> <a href="../classes/CurrentUserService.html">CurrentUserService</a> </li> <li> <a href="../classes/DepartmentTransitionMixin.html">DepartmentTransitionMixin</a> </li> <li> <a href="../classes/ForgotPage.html">ForgotPage</a> </li> <li> <a href="../classes/FwAppAdapter.html">FwAppAdapter</a> </li> <li> <a href="../classes/FwAppLink.html">FwAppLink</a> </li> <li> <a href="../classes/FwDocLink.html">FwDocLink</a> </li> <li> <a href="../classes/FwGcNav.html">FwGcNav</a> </li> <li> <a href="../classes/FwHeaderGc.html">FwHeaderGc</a> </li> <li> <a href="../classes/GroupControlAuthenticator.html">GroupControlAuthenticator</a> </li> <li> <a href="../classes/HasApp.html">HasApp</a> </li> <li> <a href="../classes/HasDepartment.html">HasDepartment</a> </li> <li> <a href="../classes/HasRole.html">HasRole</a> </li> <li> <a href="../classes/JokesService.html">JokesService</a> </li> <li> <a href="../classes/LoginPage.html">LoginPage</a> </li> <li> <a href="../classes/MatchUtil.html">MatchUtil</a> </li> <li> <a href="../classes/MixinIndexRoute.html">MixinIndexRoute</a> </li> <li> <a href="../classes/OptionalAppAdapter.html">OptionalAppAdapter</a> </li> <li> <a href="../classes/PermissionsMixin.html">PermissionsMixin</a> </li> <li> <a href="../classes/ProfilePage.html">ProfilePage</a> </li> <li> <a href="../classes/ReLoginModal.html">ReLoginModal</a> </li> <li> <a href="../classes/ResetPage.html">ResetPage</a> </li> <li> <a href="../classes/RestrictedRoute.html">RestrictedRoute</a> </li> <li> <a href="../classes/RestrictedRouteMixin.html">RestrictedRouteMixin</a> </li> <li> <a href="../classes/UserModel.html">UserModel</a> </li> </ol> </div> </div> </li> </ol> <div class="content-container"> <div class="apidocs"> <div id="docs-main"> <div class="content"> <div class="page-header"> <h1> <i class="fa fa-bookmark-o" aria-hidden="true"></i> FwAppLink Class <a class="pull-right file-edit" href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L8" target="_blank"> <i class="fa fa-pencil" aria-hidden="true"></i> </a> </h1> </div> <div class="content-meta"> <div class="extends"> Extends: Ember.Component </div> Module: <a href="../modules/Components.html">Components</a> <div class="foundat"> Defined In: <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L8">addon\components\fw-app-link.js:8</a> </div> </div> <div class="class-description"> <p>This component is used to create a link to another FW app. It is used similarly to the Ember <code>LinkTo</code> helper.</p> <p>To use inline, parameters must be provided for the link name, the app ID, and the route name. An optional query parameters object can be added at the end. See the <a href="https://guides.emberjs.com/v3.12.0/templates/links/#toc_setting-query-params">Ember docs</a> for more information on query params</p> <pre class="code prettyprint"><code class="language-handlebars"><FwAppLink @title='Link Text' @appId='appId' @route='route.name' /> <FwAppLink @title='Link Text' @appId='appId' @route='route.name' @query= /> </code></pre> <p>When used in block format, the block contents are used in place of link text, so the first parameter is the app ID. An optional block parameter is passed containing the app metadata:</p> <pre class="code prettyprint"><code class="language-handlebars"><FwAppLink @appId='appId' @route='route.name' as |app|> <i></i> </FwAppLink> <FwAppLink @appId='appId' @route='route.name' @query=> <i>Block text</i> </FwAppLink> </code></pre> <p>If the app is missing or the user does not have access to the app, no HTML will be rendered. Use the <code>has-app</code> helper to show content when the app is missing.</p> </div> <div> <div class="page-section">  <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#tab_index" aria-controls="tab_index" role="tab" data-toggle="tab">Index</a></li> <li role="presentation"><a href="#tab_properties" aria-controls="tab_properties" role="tab" data-toggle="tab">Properties</a></li> </ul>  <div class="tab-content"> <form id="options-form" class="form-inline"> Show: <label for="api-show-inherited" class="checkbox"> <input type="checkbox" id="api-show-inherited" checked> Inherited </label> <label for="api-show-protected" class="checkbox"> <input type="checkbox" id="api-show-protected"> Protected </label> <label for="api-show-private" class="checkbox"> <input type="checkbox" id="api-show-private"> Private </label> <label for="api-show-deprecated" class="checkbox"> <input type="checkbox" id="api-show-deprecated"> Deprecated </label> </form> <div id="tab_index" role="tabpanel" class="tab-pane active" > <div class="index-section properties"> <h3>Properties</h3> <ul class="index-list properties extends"> <li class="index-item property private"> <a href="#property_app">app</a> </li> <li class="index-item property"> <a href="#property_appId">appId</a> </li> <li class="index-item property deprecated"> <a href="#property_params">params</a> <span class="flag deprecated">deprecated</span> </li> <li class="index-item property private deprecated"> <a href="#property_queryParams">queryParams</a> <span class="flag deprecated">deprecated</span> </li> <li class="index-item property private deprecated"> <a href="#property_queryString">queryString</a> <span class="flag deprecated">deprecated</span> </li> <li class="index-item property"> <a href="#property_route">route</a> </li> <li class="index-item property"> <a href="#property_title">title</a> </li> <li class="index-item property private"> <a href="#property_url">url</a> </li> </ul> </div> </div> <div id="tab_properties" role="tabpanel" class="tab-pane"> <div class="item-list"> <div id="property_app" class="property item private"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_app"></a> app </h3> <span class="type">EmberObject</span> <span class="flag private">private</span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L73">addon\components\fw-app-link.js:73</a> </p> </div> <div class="description"> <p>App meta object for the related app. Will be null if the app is not found. Set by <code>didReceiveAttrs</code>.</p> </div> </div> <div id="property_appId" class="property item"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_appId"></a> appId </h3> <span class="type"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L59">addon\components\fw-app-link.js:59</a> </p> </div> <div class="description"> <p>Shortcode of app</p> </div> </div> <div id="property_params" class="property item deprecated"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_params"></a> params </h3> <span class="type"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span> <span class="flag deprecated">deprecated</span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L45">addon\components\fw-app-link.js:45</a> </p> </div> <div class="description"> <p>Dynamic parameters array. <strong><em>This is deprecated and should not be used. Specify all your parameters</em></strong></p> </div> </div> <div id="property_queryParams" class="property item private deprecated"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_queryParams"></a> queryParams </h3> <span class="type"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span> <span class="flag deprecated">deprecated</span> <span class="flag private">private</span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L81">addon\components\fw-app-link.js:81</a> </p> </div> <div class="description"> <p>This is deprecated. Query parameters for the link. It was set if using the params array and passed query params using the <code>query-params</code> helper, but the preferred method is using the <code>@query</code> property, as is described <a href="https://guides.emberjs.com/release/routing/query-params/#toc_linkto--component">here</a></p> </div> </div> <div id="property_queryString" class="property item private deprecated"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_queryString"></a> queryString </h3> <span class="type">Computed String</span> <span class="flag deprecated">deprecated</span> <span class="flag private">private</span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L93">addon\components\fw-app-link.js:93</a> </p> </div> <div class="description"> <p>Computed property of URL encoded query params. This is again deprecated as it relies on the <code>params</code> order of the old way rather than specified values, as is with the new syntax.</p> </div> </div> <div id="property_route" class="property item"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_route"></a> route </h3> <span class="type"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L66">addon\components\fw-app-link.js:66</a> </p> </div> <div class="description"> <p>Route within the app you are linking to</p> </div> </div> <div id="property_title" class="property item"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_title"></a> title </h3> <span class="type"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L52">addon\components\fw-app-link.js:52</a> </p> </div> <div class="description"> <p>Link title, will be null in block form</p> </div> </div> <div id="property_url" class="property item private"> <h3 class="name anchorable-toc"> <a class="fa fa-link toc-anchor" href="#property_url"></a> url </h3> <span class="type">Computed String</span> <span class="flag private">private</span> <div class="meta"> <p> Defined in <a href="https://bitbucket.org/linformatics/ember-fw-gc/src/5e99b10c/addon\components\fw-app-link.js#L115">addon\components\fw-app-link.js:115</a> </p> </div> <div class="description"> <p>Computed property of link URL within the other app.</p> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <script src="../assets/vendor/prettify/prettify-min.js"></script> <script>prettyPrint();</script> <script src="../assets/vendor/jquery/jquery.min.js"></script> <script src="../assets/vendor/jquery-ui/jquery-ui.min.js"></script> <script src="../assets/vendor/bootstrap/js/bootstrap.js"></script> <script src="../assets/vendor/github-slugger/slugger.js"></script> <script src="../assets/js/yuidoc-bootstrap.js"></script> </body> </html>