# How to use third-party angular component in kibana/dashboard

**URL:** <https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789>\
**Category:** Kibana\
**Created:** [May 23, 2017, 9:54am UTC](https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789 "2017-05-23T09:54:21Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![whoami](https://avatars.discourse-cdn.com/v4/letter/w/a9a28c/32.png) [@whoami](https://discuss.elastic.co/u/whoami)\
**Post date:** [May 23, 2017, 9:54am UTC](https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789/1 "2017-05-23T09:54:21Z")

</div>

for example, I wanna use angular-xeditable in `dashboard_listing.js`, what should I do?

PS: `dashboard_listing.js` located at `src/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js`

I tried below but failed with `Unknown provider: xeditableProvider <- xeditable`

```auto
//src/core_plugins/kibana/public/kibana.js
import 'angular-xeditable/dist/css/xeditable.min.css';
import 'angular-xeditable/dist/js/xeditable.min';

...

modules.get('kibana', ['xeditable']).run(Notifier.pullMessageFromUrl);

```

```auto
//src/core_plugins/kibana/public/dashboard/listing/dashboard_listing.js

...

export function DashboardListingController($injector, $scope) {
  const $filter = $injector.get('$filter');
  const confirmModal = $injector.get('confirmModal');
  
  const xeditable = $injector.get('xeditable'); //error here
  ...
}

```

---

<div class="post-metadata">

**Author:** ![Stacey\_Gammon](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/stacey_gammon/32/14025_2.png) [@Stacey\_Gammon](https://discuss.elastic.co/u/Stacey_Gammon)\
**Post date:** [May 23, 2017, 8:10pm UTC](https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789/2 "2017-05-23T20:10:51Z")

</div>

We don't recommend forking and modifying the code directly as it makes upgrades painful. What are you trying to achieve with xeditable? If Kibana is missing some functionality, filing a github issue might be a good route, or alternatively, if it's very specific functionality you are looking for, writing a plugin might be another avenue to explore.

---

<div class="post-metadata">

**Author:** ![whoami](https://avatars.discourse-cdn.com/v4/letter/w/a9a28c/32.png) [@whoami](https://discuss.elastic.co/u/whoami)\
**Post date:** [May 24, 2017, 1:19am UTC](https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789/3 "2017-05-24T01:19:16Z")

</div>

change is under control, I wanna know why cannot inject third-party angular component

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [June 21, 2017, 1:19am UTC](https://discuss.elastic.co/t/how-to-use-third-party-angular-component-in-kibana-dashboard/86789/4 "2017-06-21T01:19:23Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
