1. ¿Qué mecanismo se utiliza para el enlace de datos en Angular?
Respuestade principio detallada
: mecanismo de control sucio.
Análisis:
el enlace de datos bidireccional es uno de los mecanismos centrales de AngularJS. Cuando cualquier dato cambie en la vista, se actualizará en el modelo. Cuando los datos en el modelo cambien, la vista también se actualizará sincrónicamente. [Recomendación del tutorial relacionado: "Tutorial de Angular"]
El principio es que Angular establece una cola de escucha en el modelo de alcance para monitorear los cambios de datos y actualizar la vista. Cada vez que vincula algo a una vista, AngularJS insertará un $watch en la cola $watch para detectar si hay cambios en el modelo que monitorea. Cuando el navegador recibe un evento que puede ser procesado por el contexto angular, se activa el bucle $digest, atraviesa todos los $watches y finalmente actualiza el dom.
2. ¿Cómo se implementa el enlace de datos bidireccional de AngularJS?
Respuesta:
1. Cada elemento vinculado bidireccional tiene un observador.
2. Cuando ocurren ciertos eventos, se llama a la detección de datos sucios.
Estos eventos incluyen: cambios de contenido de elementos de formulario, respuestas de solicitudes de Ajax, funciones ejecutadas al hacer clic en botones, etc.
3. La detección de datos sucios detectará todos los elementos del observador bajo el ámbito raíz.
La función $digest es monitoreo de datos sucios
3. ¿Qué complementos de terceros ha utilizado en el desarrollo del proyecto angularjs?
Respuesta: AngularUi ui-router oclazyload, etc. Adjunto se incluye un artículo para verlo más de cerca https://segmentfault. com/a /1190000003858219
4. ¿Cuál es la diferencia entre ng-show/ng-hide y ng-if?
Respuesta: Todos sabemos que ng-show/ng-hide en realidad se oculta y se muestra a través de la pantalla. Y ng-if en realidad controla la adición y eliminación de nodos dom. Por lo tanto, si cargamos nodos dom en función de diferentes condiciones, entonces el rendimiento de ng-if es mejor que ng-show.
5. Explique qué es root S crope y la diferencia entre él y rootScrope, rootScrope y alcance.
Respuesta: En términos sencillos, la página root Scrope es la madre de todas las páginas rootScrope y de todas las páginas rootScrope y de todos los ámbitos.
Análisis:
echemos un vistazo a cómo generar root S cope y rootScope y rootScope y alcance.
Paso 1: Angular analiza ng-app y crea $rootScope en la memoria.
Paso 2: angular continúa analizando, encuentra la expresión {{}} y la analiza en una variable.
Paso 3: Luego, el div con ng-controller se analizará y apuntará a una función de controlador. En este momento, la función del controlador se convierte en una instancia de objeto $scope.
6. Enumere al menos tres formas de implementar la comunicación entre diferentes módulos.
Respuesta:
7. Expresión { ¿Cómo funciona {tuModelo}}?
Respuesta:
Se basa en el servicio de interpolación $. Después de inicializar la página html, encontrará estas expresiones y las marcará, por lo que cada vez que encuentre un {. {}}, se establecerá un $watch. Y $interpolación devolverá una función con parámetros de contexto. Cuando finalmente se ejecuta la función, la expresión $parse se aplica a ese alcance.
8. $http en angular
Respuesta: $http es un servicio central en AngularJS, que se utiliza para leer datos de servidores remotos.
Podemos utilizar el servicio http integrado para comunicarnos directamente con el mundo exterior. El servicio http se comunica directamente con el mundo exterior. El servicio http se comunica directamente con el mundo exterior. El servicio http simplemente encapsula el objeto XMLHttpRequest nativo del navegador.
9. Cuando ng-repeat itera una matriz, si hay los mismos valores en la matriz, ¿qué pasará y cómo resolverlo?
Respuesta: Le indicará que no se permiten duplicados en un repetidor. Agregar pista por $index para resolver el problema. Por supuesto, también puede rastrear por cualquier valor ordinario, siempre que pueda identificar de forma única cada elemento de la matriz (establecer la asociación entre dom y datos)
10. ¿Es angularjs mvc o mvvm framework?
Respuesta:
análisis de mvvm:
primero desarrolle Aquí está su Comprensión de mvc y mvvm:
en primer lugar, ¿por qué necesitamos MVC? Porque a medida que el tamaño del código aumenta cada vez más, dividir las responsabilidades es la tendencia general y, para facilitar el mantenimiento posterior, modificar una función no afecta otras funciones. Y para reutilizar, porque gran parte de la lógica es la misma. MVC es solo un medio, el objetivo final es la modularización y la reutilización.
Las ventajas de mvvm
son el bajo acoplamiento: la Vista se puede cambiar y modificar independientemente del Modelo, y el mismo Modelo de Vista puede ser reutilizado por múltiples Vistas y los cambios en la Vista y el Modelo se pueden realizar independientemente de la
reutilización: parte de la lógica de la vista puede ser; colocado en ViewModel, se pueden reutilizar varias vistas
para el desarrollo independiente: los desarrolladores pueden centrarse en el desarrollo de la lógica empresarial y los datos (ViewModemvvmdi; los diseñadores pueden centrarse en el diseño de la interfaz de usuario (Ver);
capacidad de prueba: las capas de vistas claras hacen posible Es Es más fácil y sencillo probar la lógica empresarial de la capa de presentación.
En angular, el patrón MVVM se divide principalmente en cuatro partes:
Vista: se centra en la visualización y representación de la interfaz. En angular,
contiene un montón de vistas directivas declarativas. plantillas.:
Es el pegamento entre la Vista y el Modelo, responsable de la interacción y colaboración entre la Vista y el Modelo. Es responsable de proporcionar los datos mostrados a la Vista y proporcionar una forma para que el evento Comando en la Vista opere el Modelo; el objeto $scope cumple la función de ViewModel
: es un portador de encapsulación de datos relacionados con la lógica empresarial de la aplicación. Es un objeto en el dominio empresarial al que no le importa cómo se mostrará. operado, por lo que el modelo no contendrá ninguna información relacionada con la visualización de la interfaz. En las páginas web, la mayoría de los modelos devuelven datos del servidor Ajax o son objetos de configuración global y el servicio en angular es el lugar para encapsular y procesar la lógica empresarial; relacionado con el modelo Este tipo de negocio Un servicio es un servicio de dominio que puede ser reutilizado por múltiples Controladores u otros servicios
Controlador: este no es el elemento central del patrón MVVM, pero es responsable de la inicialización del objeto ViewModel. Combinará uno o más servicios para obtener el objeto ViewModel del dominio empresarial, de modo que la interfaz de la aplicación alcance un estado utilizable cuando comience a cargarse.
La interfaz de mvc está estrechamente relacionada con la lógica y los datos se leen directamente. la base de datos. La interfaz de mvvm está ligeramente acoplada con el modo de vista y los datos de la interfaz se obtienen del modelo de vista. Por lo tanto, angularjs prefiere mvvm
11.
¿Qué roles desempeñan $ alcance, controlador, directiva y servicio en mvvm en angularjs?
Si no lo sabe, el análisis de la primera pregunta es muy claro, léalo nuevamente con atención
12. En angular ¿Cómo se controla la carga razonable de recursos estáticos en el proyecto?
Respuesta: Ninguna
13. ¿Cuánto debe pagar? ¿A qué se debe prestar atención al escribir la lógica del controlador?
Respuesta:
1. Simplificar el código (esto es lo que todos los desarrolladores deben tener)
2. Definitivamente no puedo operar el nodo dom. En este momento, puede preguntar por qué no.
Su respuesta es: las operaciones DOM solo pueden aparecer en directivas. El último lugar donde debería aparecer es en servicio. Angular aboga por el desarrollo basado en pruebas. Si aparecen operaciones DOM en el servicio o controlador, significa que la prueba no puede pasar. Por supuesto, este es solo un punto. Lo importante es uno de los beneficios de usar Angular, que es un enlace de datos bidireccional, para que pueda concentrarse en procesar la lógica empresarial sin tener que lidiar con montones de operaciones DOM. Si el código Angular todavía está lleno de varias operaciones DOM, entonces ¿por qué no usar jquery directamente para el desarrollo?
¿Qué es el desarrollo basado en pruebas? Para popularizarlo:
desarrollo basado en pruebas, el nombre completo en inglés es Test-Driven Development, o TDD para abreviar, es un nuevo método de desarrollo que es diferente del proceso de desarrollo de software tradicional. Requiere escribir código de prueba antes de escribir el código para una determinada función, y luego escribir solo el código funcional que hace que la prueba pase e impulsar todo el desarrollo a través de pruebas. Esto ayuda a escribir código conciso, utilizable y de alta calidad y acelera el proceso de desarrollo.
14.
Respuestas sobre cómo comunicarse entre controladores:
1.
Aquí hay dos métodos para eventos. Uno es alcance.scope.scope.emit, y luego obtiene parámetros escuchando el evento de root S cope; rootScope para obtener parámetros; el otro es el evento de rootScope para obtener parámetros; el otro es rootScope.broadcast, que obtiene parámetros escuchando la transmisión y escuchando los eventos del alcance.
No hay diferencia de rendimiento entre estos dos métodos en la última versión de Angular. La razón principal es que la dirección de envío del evento es diferente.
2. El servicio
puede crear un Servicio de evento dedicado, o puede dividirse según la lógica empresarial y almacenar los datos en el Servicio correspondiente.
3.
El método $ rootScope puede estar un poco sucio, pero es más conveniente, es decir, los datos se almacenan en la capa raíz S, de modo que en cada sub-área raíz, por lo que en cada subre-ámbito raíz, se puede llamar a cada subámbito, pero debe prestar atención al ciclo de vida
4. Utilice directamente el alcance alcance.scope.$nextSibling y propiedades similares
. Similar al alcance .scope.scope.parent. Este método tiene más desventajas. Oficialmente, no se recomienda utilizar ningún atributo que comience con $$, lo que no solo aumenta el acoplamiento, sino que también requiere lidiar con problemas asincrónicos y el orden de los alcances no es fijo. No se recomienda
pasar parámetros a través del almacenamiento local, variables globales o postMessage en los navegadores modernos, a menos que existan circunstancias especiales, evite este método.
15. Varios parámetros de instrucciones personalizadas
Respuesta:
Hablemos de algunos de uso común, como:
restringir: forma de declaración de la instrucción en dom E (elemento) A (atributo) C (nombre de clase) M (comentario)
plantilla: dos formas, un tipo de texto HTML; una función que acepta dos parámetros, tElemetn y tAttrs, y devuelve una cadena que representa la plantilla. La cadena de plantilla debe tener un elemento DOM raíz
templateUrl: dos formas, una es una cadena que representa la ruta del archivo HTML externo, una función que puede aceptar dos parámetros, los parámetros son tElement y tAttrs, y devuelve los caracteres del HTML externo; ruta del archivo
Compilación de cadenas (objeto o función): la opción de compilación puede devolver un objeto o función. Si la función de compilación está configurada, significa que queremos realizar operaciones DOM antes de que las instrucciones y los datos en tiempo real se coloquen en el DOM. Es seguro realizar operaciones DOM, como agregar y eliminar nodos, en esta función. Esencialmente, cuando configuramos la opción de enlace, en realidad creamos una función de enlace postLink() para que la función compile() pueda definir la función de enlace.
Luego está el portal: http://www.cnblogs.com/mliudong/p/4180680.html
La diferencia entre compilar y vincular:
al compilar, la compilación convierte el dom y lo guarda primero cuando encuentra el lugar donde está el oyente. está vinculado, varios se guardan y finalmente se resumen en una función de enlace y se ejecutan juntos, lo que mejora el rendimiento.
16. La respuesta a la diferencia entre angular y jquery
:
angular se basa en datos, por lo que angular es adecuado para proyectos con operaciones de datos complicadas (aquí puede mencionar aplicaciones de una sola página nuevamente, si no sabe cómo hacerlo it, los beneficios están aquí nuevamente http://www.zhihu .com/question/20792064)
jquery se basa en el controlador dom jquery es adecuado para proyectos con muchas operaciones dom
17. ¿Cuánto sabes sobre el formulario? angular?
Respuesta:
Angular ha ampliado el tipo de elementos de entrada y proporciona un total de los siguientes 10 tipos:
texto
número
url
correo electrónico
casilla de
verificación
botón
oculto
enviar
restablecer
Angular tiene 4 estilos CSS integrados para el formulario.
ng-valid verifica el estado legal
ng-invalid verifica el estado ilegal
ng-pristine Si desea utilizar el formulario nativo, debe establecer este valor
ng-dirty El formulario está en el estado de datos sucios
Angular verificará el modelo cuando
.verificando automáticamente el formulario Si ng-model no está configurado, Angular no puede saber si el valor de myForm.$invalid es verdadero.
El contenido requerido para la verificación
indica si se debe ingresar el contenido
ng-maxlength, longitud máxima
ng-minlength, longitud mínima
Ejemplo: Portal https://github.com/18500047564/clutter
18. ¿Qué es el filtro?
Implemente unarespuesta
de filtro personalizado
:fecha (fecha)
moneda (moneda)
limitTo (limitar la longitud de una matriz o cadena)
orderBy (ordenar)
minúsculas (minúsculas)
mayúsculas (mayúsculas)
número (formatear un número, agregar un separador de miles y Recibir los parámetros limitan el número de puntos decimales)
filter (procesar una matriz, filtrar elementos que contienen una determinada subcadena)
json (formatear objeto json)
Hay dos formas de usar el filtro,
una es directamente en la página:
<p>{{ahora | fecha: 'aaaa-MM-dd'}}</p> La otra es usarla en js:
$filter('nombre del filtro')(objeto a filtrar, parámetro 1, parámetro 2,...)
$filter('date')(ahora, 'yyyy-MM-dd hh:mm:ss'); Personaliza una matriz de deduplicación
app.filter("unique", function() {
función de retorno (arr) {
varn = [];
var objeto = {};
for (var i = 0; i <arr.length; i++) {
si (!obj[arr[i]]) {
n.push(arr[i]);
obj[arr[i]] = 1;
}
}
devolver n;
};
});