This is the extensions about directives, filters for AngularJS.
- Rename module bn.ui to nb.ui
- All components starts with nb
- Add methods as below:
- angular.start("ngApp", {});
- angular.resetForm($scope.formName);
- angular.ajaxAll($http.get(...), $http.post(...)).then(function(values){});
- Update documentation and demo
- New directives: bn-ui-loading, bn-ui-html-editor
Requires:
- angularjs
- angular-sanitize
- angular-date-time-input
- angular-bootstrap-datetimepicker
- bootstrap
- bootstrap-more
- momentjs
-
Clone the repo
git clone /~https://github.com/bndynet/angular-more.gitgit submodule initgit submodule update -
Update node modules
npm install
Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:
angular-more/
├── dist/
│ ├── angular-more.css
│ ├── angular-more.min.css
│ ├── angular-more.js
│ └── angular-more.min.js
├── demo/
├── test/
└── src/
<link href="lib/angular-bootstrap-datetimepicker/src/css/datetimepicker.css" rel="stylesheet"/>
<!-- Latest compiled and minified CSS -->
<link href="dist/angular-more.min.css" rel="stylesheet"/>
<script src="lib/moment/min/moment.min.js"></script>
<script src="lib/angular/angular.min.js"></script>
<script src="lib/angular-date-time-input/src/dateTimeInput.js"></script>
<script src="lib/angular-bootstrap-datetimepicker/src/js/datetimepicker.js"></script>
<script src="lib/angular-bootstrap-datetimepicker/src/js/datetimepicker.templates.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="dist/angular-more.min.js"></script>var app = angular.module("app", ["nb.ui"]);Based on Jasmine and Karma.
<div class="row">
<bn-ui-input class="col-xs-4" label="Username" ng-model="model.username" required></bn-ui-input>
<bn-ui-input class="col-xs-4" label="Birthday" ng-model="model.birthday" type="date" format="MM/DD/YYYY"></bn-ui-input>
<bn-ui-input class="col-xs-4" label="Date Time" ng-model="model.datetime" type="datetime" format="MM/DD/YYYY h:mm a"></bn-ui-input>
</div>- ng-model=string
- source={text: value}
<bn-ui-select class="col-xs-4" label="Dropdown" ng-model="model.dropdown" source="model.source"></bn-ui-select>$scope.model = {
source: {"option 1": "1", "option 2": "2"},
dropdown: "2"
};- source={text: value}
- multiple=true/false
- with-icon=true/false
- ng-model=object/[]
- show-button=true/false
<bn-ui-checks label="Radio/Checkbox" source="source" ng-model="model" multiple="true" with-icon="true" show-button="true"></bn-ui-checks>$scope.source = {
"Option 1": "1",
"Option 2": "2",
"Option 3": "3",
"Option 4": "4",
"Option 5": "5",
};
$scope.model = ["2", "4"];- ng-model={currentPage, pageSize, recordCount}
- on-page=fn(page) //"page" is required
<bn-ui-pager ng-model="{currentPage: 1, pageSize: 10, recordCount: 108 }" on-page="getData(page)"></bn-ui-pager>Code and documentation (c) 2014-2017 Bndy.Net. Code released under the MIT License.