angular
Todas las bibliotecas utilizadas, CDN utilizadas:
La copia del código es la siguiente:
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
Instancia de enlace de datos de .Angular, esta es la más básica, todas las ramas y hojas de inicio angular desde aquí:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Lo más poderoso de Angular es la unión de enlace de datos
</div>
<div>
<div id = "bind" ng-confontroller = "bf">
<input type = "text" ng-model = "data" />
{{datos}}
<script>
app.controller ("bf", function ($ scope) {
$ scope.data = "testData";
// $ alcance. $ Aplicar ();
});
</script>
</div>
</div>
</div>
</body>
</html>
A través de Angular, muestre los datos correspondientes de la matriz;.
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
A través de Angular, muestre los datos correspondientes de la matriz;
</div>
<div>
<div id = "arr-bind" ng-apx = "arr-app" ng-Controller = "arrcon">
<estilo>
.s{
Color:#F00;
}
li {
cursor: puntero;
}
</style>
<ul>
<li ng-repeat = "i en listas" ng-click = "bered ($ index)" ng-class = "{s: $ index == flag}">
{{i.name}} ---- {{i.age}}
</li>
</ul>
<script>
//angular.module("arr-app ", []);
función arrcon ($ alcope) {
$ scope.flag = 0;
$ scope.bered = function (i) {
$ scope.flag = i;
};
$ scope.lists = [
{Nombre: "jeje",
Edad: 10},
{
Nombre: "xx",
Edad: 20
},
{
Nombre: "YY",
Edad: 2
},
{
Nombre: "JJ",
Edad: 220
}
]
};
</script>
</div>
</div>
</div>
</body>
</html>
Demostración del filtro de datos:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Filtro de datos;
</div>
<div ng-confontroller = "filte">
{{Sourcode}}
<br>
{{Sourcode | arriba}}
</div>
<script>
Filtro de funciones ($ alcance) {
$ scope.sourcode = "jeje lala dudu oo zz";
};
app.filter ("up", function () {
Función de retorno (IPT) {
devolver ipt.replace (/(/w)/g, función ($ 0, $ 1) {
devolver ""+$ 1.ToUpperCase ();
});
}
});
</script>
</div>
</body>
</html>
La fábrica de fábrica, $ proveedor, servicio, etc. son todos iguales. No sientas que es difícil. De hecho, es solo para ver un modelo o instancia de datos;:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div id = "fábrica">
<div>
La fábrica en Angular es equivalente a un método de instancia común, que puede entenderse como una función que los controladores múltiples pueden usar;
</div>
<div ng-confontroller = "fábrica">
{{json}}
<script>
app.factory ("ff", function () {
devolver {
"Notando": "Json"
};
});
app.controller ("fábrica", function ($ scope, ff) {
$ scope.json = ff;
});
</script>
</div>
</div>
<div>
<div>
directiva angular;
</div>
<div>
<jeh> ¿estás contento con? </jeh>
<script>
app.directive ("heh", function () {
devolver {
restringir: "ae",
Reemplazar: Verdadero,
TRANSCLUDE: VERDADERO,
plantilla: '<div> <botón ng-transclude> </boton> </div>'
};
})
</script>
</div>
</div>
</body>
</html>
El uso de la directiva .ng-switch (realmente quiero esta plantilla, que es el angular de nuestros clics comunes para ocultar y mostrar el complemento de pestaña primero) ::
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Uso de interruptor ng
</div>
<div ng-confontroller = "SW">
<div ng-init = "a = 2">
<ul ng-switch on = "a">
<li ng-switch-when = "1"> 1 </li>
<li ng-switch-when = "2"> 2 </li>
<li ng-switch-default> otros </li>
</ul>
</div>
<div>
<botón ng-click = "a = 1"> test </boton>
<botón ng-click = "a = 2"> test </boton>
<botón ng-click = "a = 3"> test </boton>
</div>
</div>
<script type = "text/javaScript">
app.controller ("sw", function ($ scope) {
});
</script>
</div>
</body>
</html>
ng-src y ng-href;
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Uso de NG-SRC y NG-HREF (si usa SRC o HREF, el HTML se cargará al inicializarlo, lo que definitivamente no es posible)
</div>
<div ng-confontroller = "srccon">
<a ng-href = "{{logo}}">
<img ng-src = "{{logo}}" />
</a>
</div>
<script type = "text/javaScript">
app.controller ("srccon", function ($ scope) {
$ scope.logo = "http://www.mainbo.com/tempplets/images/logo.gif";
});
</script>
</div>
</body>
</html>
Cómo operar el estilo de página, simplemente cambie el modelo de datos límite directamente:
La copia del código es la siguiente:
<div>
<div>
Angular opera en estilos; (JQ es seleccionar manualmente elementos para operar en estilos de elementos. Angular proporciona un método más para asignar los atributos del elemento a una variable, solo necesita cambiar esta variable)
</div>
<div>
<jeje id = "wh" ng-style = "{ancho: w + 'px', altura: h + 'px', fondoscolor: '#364'}">
jeje-o (^^) Oh wow;
</jeje>
</div>
<script type = "text/javaScript">
app.directive ("jeje", function () {
function compile () {
};
devolver {
Enlace: function ($ scope, $ element) {
var obj = angular.element ($ elemento);
//obj.find no es fácil de usar;
var add = obj [0] .getElementsByClassName ("add") [0];
var reduce = obj [0] .getElementsByClassName ("reducir") [0];
angular.element (add) .bind ("hacer clic", function () {
$ scope.h = $ scope.h+10;
aplicar();
})
angular.element (reducir) .bind ("hacer clic", function () {
$ scope.h = $ scope.h-10;
aplicar();
});
función aplicar () {
$ alcance. $ Aplicar ();
}
Compilar de regreso;
},
controlador: function ($ alcope) {
$ alcance.w = 200;
$ alcance.h = 50;
// $ alcance. $ Aplicar ();
},
restringir: 'ae',
Reemplazar: Verdadero,
Alcance: "= estilo ng",
TRANSCLUDE: VERDADERO,
Template: '<iv> <div ng-transclude> </div> <boton>+</boton> <botton>-</boton> </div>'
}
})
</script>
</div>
¿Cómo usar la plantilla en angular? Esto debe usarse con el enrutador:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Usando plantillas
</div>
<div ng-confontroller = "ngtpl">
<! --- Este tipo debe declararse con precisión->
<script type = "text/ng-template" id = "tpl">
{{ver}}
</script>
<! --- tpl es un valor fijo, no una variable, y la variable debe definirse en el alcance --->
<div ng-include src = "'tpl'"> </div>
<div>
<botón ng-click = "chan ()"> cambiar </boton>
</div>
</div>
<script type = "text/javaScript">
app.controller ("ngtpl", function ($ scope) {
función jeje (str) {
str = _.shuffle (str);
regresar str.Join ("")
};
$ scope.ver = "var-ver-heehe";
$ scope.chan = functer () {
$ scope.ver = jeje ($ scope.ver);
};
});
</script>
</div>
</body>
</html>
Cómo usar $ alcance. $ Reloj para cambiar la plantilla de la interfaz de enlace en tiempo real:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
<span> actualizaciones de datos de notificación angular de notificación de tres maneras $ scope. $ digest (), $ scope. $ apply () y actualizaciones a través de $ alcance. $ ver escucha;
</div>
<div ng-confontroller = "aplicar">
{{jeje}}
<input type = "text" ng-model = "m0" />
<div>
El valor establecido por $ scope. $ watch == >> {{wat}}
</div>
<br>
<botón ng-click = "up ()">
aplicar;
</botón>
</div>
<script type = "text/javaScript">
app.controller ("aplicar", function ($ alcope) {
$ scope.hehe = "lll________xxx";
$ scope.m0 = 1;
SS = $ alcance;
$ scope.up = function () {
$ scope.hehe = $ scope.m0;
// Sí, pero se informó un error cuando se dio la solicitud. ¿Quién sabe por qué?
// $ alcance. $ Aplicar ();
$ alcance. $ digest ();
};
// dar la variable $ scope.m0 para ser inválido;
$ alcance. $ watch ("m0", function (VA) {
$ scope.wat = VA;
})
});
</script>
</div>
</body>
</html>
El método de herramienta que se defina en angular
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Lista de método de herramienta en Angular
</div>
<div>
<ul>
<li role = "presentación"> <a href = "###"> angular.bind </a> </li>
<li role = "presentación"> <a href = "###"> angular.bootstrap </a> </li>
<li role = "presentación"> <a href = "###"> angular.copy </a> </li>
<li role = "presentación"> <a href = "###"> angular.element </a> </li>
<li role = "presentación"> <a href = "###"> angular.equals </a> </li>
<li role = "presentación"> <a href = "###"> angular.extend </a> </li>
<li role = "presentación"> <a href = "###"> Angular.ForEach </a> </li>
<li role = "presentación"> <a href = "###"> angular.fromjson </a> </li>
<li role = "presentación"> <a href = "###"> angular.identity </a> </li>
<li role = "presentación"> <a href = "###"> angular.injector </a> </li>
<li role = "presentación"> <a href = "###"> Angular.isArray </a> </li>
<li role = "presentación"> <a href = "###"> angular.isdate </a> </li>
<li role = "presentación"> <a href = "###"> angular.isdefined </a> </li>
<li role = "presentación"> <a href = "###"> Angular.iselement </a> </li>
<li role = "presentación"> <a href = "###"> Angular.Isfunction </a> </li>
<li role = "presentación"> <a href = "###"> angular.isnumber </a> </li>
<li role = "presentación"> <a href = "###"> angular.isobject </a> </li>
<li role = "presentación"> <a href = "###"> angular.isstring </a> </li>
<li role = "presentación"> <a href = "###"> angular.isundefined </a> </li>
<li role = "presentación"> <a href = "###"> angular.lowercase </a> </li>
<li role = "presentación"> <a href = "###"> angular.module </a> </li>
<li role = "presentación"> <a href = "###"> angular.noop </a> </li>
<li role = "presentación"> <a href = "###"> angular.reloadwithdebuginfo </a> </li>
<li role = "presentación"> <a href = "###"> Angular.tojson </a> </li>
<li role = "presentación"> <a href = "###"> angular.uppercase </a> </li>
</ul>
<div>
Estas herramientas y métodos son similares a otras bibliotecas;
Angular.Element es un pequeño JQ para el elemento de selección de Anguarlita;
<br>
Angular.module es un método de elementos del módulo;
</div>
</div>
</div>
</body>
</html>
El uso de Ng-Transclude (este es un caso oficial), el código es el siguiente:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
Uso de Ng-Transclude (este es un caso oficial):
</div>
<div ng-confontroller = "examplePrecontroller">
<div>
<input ng-model = "title"> <br>
<Textarea ng-model = "text"> </textarea> <br/>
<pane> {{text}} </pane>
</div>
</div>
<script type = "text/javaScript">
app.directive ('panel', function () {
devolver {
restringir: 'e',
TRANSCLUDE: VERDADERO,
Alcance: {Título: '@'},
plantilla: '<div style = "border: 1px sólido negro;">' +
'<div style = "Background-Color: Gray"> {{Title}} </div>' +
'<Ng Transclude> </ng-Transclude>' +
'</div>'
};
})
.Controller ('Ejemplecontroller', ['$ scope', function ($ scope) {
$ scope.title = 'lorem ipsum';
$ scope.text = 'Nequ Porno quisquam est qui dolorem ipsum quia dolor ...';
}]);
</script>
</div>
</body>
</html>
Aquí hay un ejemplo de verificación de la precisión del buzón:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
ngpaste, ngmouseup, ngkeyup, ngmodeloptions, etc., consulte el uso oficial, solo use la API de verificación (las necesidades oficiales FQ;)
</div>
<script src = "https://yearofmoo.github.io/ngmessages/angular-messages.js"> </script>
<div ng-confontroller = "fromVaild">
Si no usa el componente NG-Message, el mensaje de error es el siguiente;
<form de nombre = "userform">
<div>
<etiqueta for = "emailAddress"> Ingrese su dirección de correo electrónico: </selebel>
<input type = "correo electrónico" name = "correo electrónicoaddress" ng-model = "data.email" requerido />
<!-Estas cosas son demasiado complejas->
<div ng-if = "userForm.EMAILAddress. $ Error.Required">
Olvidó ingresar su dirección de correo electrónico ...
</div>
<div ng-if = "! UserForm.EMailaddress. $ Error.required &&
userForm.EMAILAddress. $ Error.email ">
No ingresó su dirección de correo electrónico correctamente ...
</div>
</div>
<input type = "enviar" />
</form>
<br>
<a href = "https://yearofmoo.github.io/ngmessages/"> Demo escrito por extranjeros </a>
</div>
<script type = "text/javaScript">
app.controller ("fromVaild", function ($ scope) {
//$cope.myfield.$error = {minLength: true, requerido: falso};
})
</script>
</div>
</body>
</html>
SetTimeOut y SetInterval están envueltos por Angular y devuelven una instancia del objeto retrasado:
La copia del código es la siguiente:
<! DocType html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transicional.dtd ">
<html xmlns = "http://www.w3.org/1999/xhtml">
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> Angular </title>
<meta http-oquiv = "x-ua-compatible" content = "ie = bord, chrome = 1">
<script src = "http://cdn.bootcss.com/jquery/2.1.1/jquery.js"> </script>
<script src = "http://cdn.bootcss.com/angular.js/1.3.0-beta.13/angular.min.js"> </script>
<Link href = "http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.css" rel = "stylesheet">
<script src = "http://cdn.bootcss.com/underscore.js/1.7.0/underscore-min.js" type = "text/javaScript"> </script>
</ablo>
<cuerpo ng-app = "app">
<script type = "text/javaScript">
var app = angular.module ("app", []);
</script>
<div>
<div>
$ Tiempo de espera y $ Interval, estos dos servicios;
</div>
<div ng-confontroller = "st">
<div>
<a href = "#">
<h4> setInterval </h4>
<p>
$ intervalo (fn, demora, [cuenta], [invokeApply]);
</p>
</a>
<a href = "#">
<h4> Tiempo de espera </h4>
<p>
$ TIMEOUT (FN, [Delebre], [InvokeApply]);
</p>
</a>
</div>
<div>
<div role = "ProgressBar" Aria-Valuenw = "60" Aria-Valuemin = "0" Aria-Valuemax = "100">
0%
</div>
</div>
<botón ng-click = "prog ()">
comenzar
</botón>
</div>
<script type = "text/javaScript">
app.controller ("st", function ($ scope, $ element, $ interval) {
var $ el = $ ($ elemento [0]). Find (". Progress-bar");
console.log (argumentos);
// Use el elemento seleccionado por Angular.Element para encontrar algo sin encontrar;
$ scope.prog = function () {
var df = $ interval (function () {
var val = parseint ($ el.html ())+4;
if (val> = 104) $ interval.cancel (df);
$ el.html (val+"%") .Width (val+"%");
}, 100);
console.log (DF)
//console.log(aa = $ interval)
};
});
</script>
</div>
</body>
</html>