javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 23:16:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add list item type to directive

Browse Source
This commit is contained in:
Max Lynch
2013-11-11 16:09:46 -06:00
parent 4a12f39821
commit 2ffb925a97
5 changed files with 31 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
dist/js/ionic-angular.js vendored
View File

@ -560,10 +560,10 @@ angular.module('ionic.ui.content', [])
angular.module('ionic.ui.list', ['ngAnimate'])
.directive('listItem', ['$timeout', function($timeout) {
.directive('item', ['$timeout', function($timeout) {
return {
restrict: 'E',
require: ['?^list', '?^virtualList'],
require: ['?^list'],
replace: true,
transclude: true,
scope: {
@ -574,8 +574,9 @@ angular.module('ionic.ui.list', ['ngAnimate'])
canReorder: '@',
canSwipe: '@',
buttons: '=',
type: '@'
},
template: '<a href="#" class="item item-slider">\
template: '<a href="#" class="item">\
<div class="item-edit" ng-if="canDelete && isEditing">\
<button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
</div>\
@ -589,20 +590,6 @@ angular.module('ionic.ui.list', ['ngAnimate'])
</div>\
</a>',
/*
template: '<li class="list-item">\
<div class="list-item-edit" ng-if="canDelete && isEditing">\
<button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
</div>\
<div class="list-item-content" ng-transclude>\
</div>\
<div class="list-item-drag" ng-if="canReorder && isEditing">\
<button data-ionic-action="reorder" class="button button-icon"><i ng-class="reorderIcon"></i></button>\
</div>\
<div class="list-item-buttons" ng-if="canSwipe && !isEditing">\
<button ng-click="buttonClicked(button)" class="button" ng-class="button.type" ng-repeat="button in buttons">{{button.text}}</button>\
</div>\
</li>',*/
link: function($scope, $element, $attr, list) {
// Grab the parent list controller
if(list[0]) {
@ -611,6 +598,13 @@ angular.module('ionic.ui.list', ['ngAnimate'])
list = list[1];
}
// Add the list item type class
$element.addClass($attr.type || 'item-slider');
if($attr.type !== 'item-slider') {
$scope.canSwipe = false;
}
$scope.isEditing = false;
$scope.deleteIcon = list.scope.deleteIcon;
$scope.reorderIcon = list.scope.reorderIcon;

28
js/ext/angular/src/directive/ionicList.js vendored
View File

@ -3,10 +3,10 @@
angular.module('ionic.ui.list', ['ngAnimate'])
.directive('listItem', ['$timeout', function($timeout) {
.directive('item', ['$timeout', function($timeout) {
return {
restrict: 'E',
require: ['?^list', '?^virtualList'],
require: ['?^list'],
replace: true,
transclude: true,
scope: {
@ -17,8 +17,9 @@ angular.module('ionic.ui.list', ['ngAnimate'])
canReorder: '@',
canSwipe: '@',
buttons: '=',
type: '@'
},
template: '<a href="#" class="item item-slider">\
template: '<a href="#" class="item">\
<div class="item-edit" ng-if="canDelete && isEditing">\
<button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
</div>\
@ -32,20 +33,6 @@ angular.module('ionic.ui.list', ['ngAnimate'])
</div>\
</a>',
/*
template: '<li class="list-item">\
<div class="list-item-edit" ng-if="canDelete && isEditing">\
<button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
</div>\
<div class="list-item-content" ng-transclude>\
</div>\
<div class="list-item-drag" ng-if="canReorder && isEditing">\
<button data-ionic-action="reorder" class="button button-icon"><i ng-class="reorderIcon"></i></button>\
</div>\
<div class="list-item-buttons" ng-if="canSwipe && !isEditing">\
<button ng-click="buttonClicked(button)" class="button" ng-class="button.type" ng-repeat="button in buttons">{{button.text}}</button>\
</div>\
</li>',*/
link: function($scope, $element, $attr, list) {
// Grab the parent list controller
if(list[0]) {
@ -54,6 +41,13 @@ angular.module('ionic.ui.list', ['ngAnimate'])
list = list[1];
}
// Add the list item type class
$element.addClass($attr.type || 'item-slider');
if($attr.type !== 'item-slider') {
$scope.canSwipe = false;
}
$scope.isEditing = false;
$scope.deleteIcon = list.scope.deleteIcon;
$scope.reorderIcon = list.scope.reorderIcon;

6
js/ext/angular/test/list.html
View File

@ -67,16 +67,18 @@
<list is-editing="isEditingItems" on-refresh-holding="almostRefreshing()" on-refresh-opening="almostRefreshProjects(ratio)" on-refresh="refreshProjects()" animation="my-repeat-animation" delete-icon="icon ion-minus-circled" reorder-icon="icon ion-navicon">
<list-refresher>
</list-refresher>
<list-item ng-repeat="item in items"
<item
ng-repeat="item in items"
buttons="item.buttons"
can-delete="true"
can-reorder="true"
can-swipe="true"
on-delete="deleteProject(project)"
on-select="selectProject(project)">
<i class="icon ion-email ion-primary"></i>
{{item.text}}
<i class="{{item.icon}}"></i>
</list-item>
</item>
</list>
<button ng-click="edit()" class="button button-success">Edit</button>
</div>

4
js/ext/angular/test/tabs.html
View File

@ -60,7 +60,7 @@
<h1 class="title">Tasks</h1>
<button class="button button-clear button-primary" ng-click="isEditingItems = !isEditingItems">Edit</button>
</header>
<content has-header="true" has-tabs="true" scroll="false">
<content has-header="true" has-footer="true" scroll="false">
<list on-refresh="onRefresh()" is-editing="isEditingItems" animation="fade-out" delete-icon="icon ion-minus-circled" reorder-icon="icon ion-navicon">
<refresher>
<div id="refresh-content">
@ -68,7 +68,7 @@
<i class="icon ion-ios7-reloading"></i>
</div>
</refresher>
<list-item ng-repeat="item in items"
<item ng-repeat="item in items"
item="item"
buttons="item.buttons"
can-delete="true"

4
test/lists.html
View File

@ -21,7 +21,7 @@
</header>
<div id="list">
<main id="content" class="scroll">
<main id="content" class="content overflow-scroll">
<div class="list">
@ -500,6 +500,8 @@
return false;
});
</script>
</body>