Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/zeeshanhyder/angular-right-click
Angular right click and context menu library. No dependencies.
https://github.com/zeeshanhyder/angular-right-click
angular callback right-click
Last synced: 3 months ago
JSON representation
Angular right click and context menu library. No dependencies.
- Host: GitHub
- URL: https://github.com/zeeshanhyder/angular-right-click
- Owner: zeeshanhyder
- License: mit
- Created: 2016-04-15T12:20:09.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-02-20T07:08:30.000Z (almost 8 years ago)
- Last Synced: 2024-10-14T14:34:22.701Z (3 months ago)
- Topics: angular, callback, right-click
- Language: JavaScript
- Size: 7.81 KB
- Stars: 11
- Watchers: 2
- Forks: 6
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-angular - angular-right-click - Angular right click and context menu library. No dependencies. (Uncategorized / Uncategorized)
README
# angular-right-click
Angular right click and context menu library. No dependencies.
## Installation
### General
- Copy/move `ng-right-click.js` from `src` dir in the package to your project dir
- In your Angular app, add a dependency to your module as below:
`angular.module('yourApp',['ngRightClick',...]');`
### bower
In your project dir, type the following command:
```sh
$ bower install angular-right-click
```
Then add a `` in your project `html`:
```javascript
<script src='/bower_components/angular-right-click/src/ng-right-click.js'>
```
And finally in your Angular app, add the dependency as:
`angular.module('yourApp',['ngRightClick',...]');`
### npm
In your project dir, run the following command:
```sh
$ npm install angular-right-click
```
Then `require()` in your project source as:
```javascript
require('angular-right-click')
```
### CSS
Import default `css` file in your project `index` file as:
```html
```
## Usage
### Basic callback only (like `ng-click`, no context menu)
```html
```
### Context-menu only option
In your html file, use the component like this:
```html
```
### Both callback and context-menu option
```html
```
where the data format is (in your controller):
```javascript
$scope.sayHello = function(){
//say hello!
};
$scope.menuItems = [
{ text: "Menu Item 1", //menu option text
disabled: true //No click event. Grayed out option.
},
{
text:"Menu Item 2",
callback: sayHello, //function to be called on click
disabled: false
}
];
```
### Styling
I have included a default `css` file for default styling. Include it in your file. You can easily override it with your custom `css` class lie that:
```html
```
## Examples
Please check the examples directory to get the gist!
Check code example [here](https://github.com/zeeshanhyder/angular-right-click/tree/master/examples).