https://github.com/sagrawal31/angular-extras
A light weight library to provide some extensions to AngularJS(1) without jQuery.
https://github.com/sagrawal31/angular-extras
angular angular-directives
Last synced: 17 days ago
JSON representation
A light weight library to provide some extensions to AngularJS(1) without jQuery.
- Host: GitHub
- URL: https://github.com/sagrawal31/angular-extras
- Owner: sagrawal31
- License: mit
- Created: 2016-06-15T12:12:53.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-03-09T08:35:16.000Z (about 8 years ago)
- Last Synced: 2026-01-26T12:55:29.378Z (about 1 month ago)
- Topics: angular, angular-directives
- Language: JavaScript
- Homepage:
- Size: 76.2 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: ChangeLog.md
- License: LICENSE
Awesome Lists containing this project
README
# Angular Extras
A light weight library to provide some extensions to Angular without jQuery.
## Usage
### 1. Install via Bower
```shell
bower install angular-extras --save
```
### 2. Add the script to your main HTML file (like index.html)
Include each file based on your need. For example:
```html
```
## Description
### DOM Extras
```html
```
This module provides some DOM related helper methods like jQuery but without using jQuery. All of the following
methods return the instance of jQLite.
#### 1. find(selector)
Get the descendant of element in the current set of matched elements, filtered by a selector.
```javascript
angular.find('div'); // Get the first DIV element in the body
someDomeElementInDirective.find('input'); // Find the first input element in the directive's element
```
#### 2. findAll(selector)
```javascript
angular.findAll('div'); // Get all the descendant DIV elements in the body
someDomeElementInDirective.findAll('input'); // Find all the descendant input elements in the directive's element
```
#### 3. parents(selector)
```javascript
someDomeElementInDirective.parents('div.foo'); // Find all the parent DIV elements with class "foo"
```
#### 4. closest(selector)
```javascript
someDomeElementInDirective.closest('div.foo'); // Find all the parent DIV elements including self with class "foo"
```
----------
### Form Directives
```html
```
Include the module:
```javascript
angular.module('myApp', ['...', 'angular.extras.form.directives'])
```
#### 1. autofocus
The attribute `autofocus` of HTML5 only works when the page load but does not focus the input element when the
contents are loaded dynamically (like when views are loaded via route or `ng-include`).
```html
```
#### 2. focus-on
Focuses the DOM element based on the expression.
```html
```
----------
### Page Directives
```html
```
Include the module:
```javascript
angular.module('myApp', ['...', 'angular.extras.page.directives']);
```
#### body-classes
Set classes on the `body` element from anywhere through your DOM element.
```html
```
#### email
Converts plain HTML email text to a email link.
```html
john@example.com
{{user.email}}
```
#### page-title
Set the page's `` value from any DOM element.
```html
Friends page
```
#### url
Converts plain HTML url text to the link.
```html
https://google.com
{{user.linkedin}}
```