Skip to content

Commit

Permalink
modificaciones de directivas
Browse files Browse the repository at this point in the history
  • Loading branch information
pepesan committed May 11, 2016
1 parent 2d0f1d1 commit caf884b
Showing 2 changed files with 137 additions and 3 deletions.
9 changes: 6 additions & 3 deletions custom-directive.html
Original file line number Diff line number Diff line change
@@ -114,7 +114,8 @@ <h2>Directiva de Etiqueta con scope compartido</h2>
app.directive('conScopeCompartido', function() {
return {
restrict: 'E',
template: '<div>Esta es una variable del scope del controlador del módulo: {{variable}}</div>',
template: '<div>Esta es una variable del scope del ' +
'controlador del módulo: {{variable}}</div>',
replace:true,
scope:true
}
@@ -129,10 +130,12 @@ <h2>Directiva de Etiqueta con scope propio</h2>
return {
restrict: 'E',
scope:{
//copia el valor del atributo clase al scope, model unidireccional
//copia el valor del atributo clase al scope,
// model unidireccional
ngParametro:"@"
},
template: '<div class="{{ngParametro}}">Esta es una variable del scope del propio: {{variable}}</div>',
template: '<div class="{{ngParametro}}">Esta es una variable ' +
'del scope del propio: {{variable}}</div>',
replace:true,

controller:function($scope){
131 changes: 131 additions & 0 deletions custom-filters.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,131 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/angular.js">
</script>
</head>
<body ng-app="app" ng-init="numero=14,cadena='micadena'">
<h1>{{numero |ordinal}}</h1>

<script>
var app=angular.module("app",[]);
// Setup the filter
app.filter('ordinal', function() {

// Create the return function
// set the required parameter name to **number**
return function(number) {

// Ensure that the passed in data is a number
if(isNaN(number) || number < 1) {

// If the data is not a number or is less than one (thus not having a cardinal value) return it unmodified.
return number;

} else {

// If the data we are applying the filter to is a number,
// perform the actions to check it's ordinal suffix and apply it.

var lastDigit = number % 10;

if(lastDigit === 1) {
return number + 'st'
} else if(lastDigit === 2) {
return number + 'nd'
} else if (lastDigit === 3) {
return number + 'rd'
} else if (lastDigit > 3) {
return number + 'th'
}

}
}
});
</script>
<h1>{{cadena | capitalize:3}}</h1>
<script>
// Setup the filter
app.filter('capitalize', function() {

// Create the return function and set the required parameter as well as an optional paramater
return function(input, char) {

if (isNaN(input)) {

// If the input data is not a number, perform the operations to capitalize the correct letter.
var char = char - 1 || 0;
var letter = input.charAt(char).toUpperCase();
var out = [];

for (var i = 0; i < input.length; i++) {

if (i == char) {
out.push(letter);
} else {
out.push(input[i]);
}

}

return out.join('');

} else {
return input;
}

}

});
</script>
<div class="container" ng-controller="demo">
<div class="row">
<div class="col-lg-6 col-lg-offset-3">
<div ng-app="filters">
<div ng-controller="demo">
<div class="panel panel-default">
<div class="panel-body">
<h4 class="text-center">AngularJS Filter - Static Languages</h4>
<p><strong>Original:</strong></p>
<ul class="list">
<li ng-repeat="lang in example1">{{lang.name}}</li>
</ul>
<p><strong>Static Language Filter:</strong></p>
<ul class="list">
<li ng-repeat="lang in example1 | staticLanguage">{{lang.name}}</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<script>
app.controller('demo', function($scope){
$scope.example1 = [
{name: 'C#', type : 'static'},
{name: 'PHP', type : 'dynamic'},
{name: 'Go', type : 'static'},
{name: 'JavaScript', type: 'dynamic'},
{name: 'Rust', type: 'static'}
]
})

app.filter('staticLanguage', function(){
return function(input){
var out = [];
angular.forEach(input, function(language){
if(language.type === 'static'){
out.push(language)
}
})
return out;
}
})
</script>
</body>
</html>

0 comments on commit caf884b

Please sign in to comment.