javascript - programacion - ¿Cómo haces que Angular.js funcione en una aplicación de la tienda de Windows 8?

que es angular en programacion

Question

La aplicación se ejecuta pero los objetos de datos angulares no son reconocidos.

Aquí está el error de JavaScript que recibo:

Exception was thrown at line 1059, column 11 in ms-appx://28934b41-4dd2-4414-b9a9-
a73c11c1b743/js/angular.js
0x800a139e - JavaScript runtime error: No module: ngLocale
Exception was thrown at line 4473, column 9 in ms-appx://28934b41-4dd2-4414-b9a9-
a73c11c1b743/js/angular.js
0x800a139e - JavaScript runtime error: HierarchyRequestError
The program ''[5112] WWAHost.exe'' has exited with code 1 (0x1).

Aquí está la función alrededor de la línea 1059 en angular.js:

return ensure(modules, name, function() {
    if (!requires) {
      throw Error(''No module: '' + name);
    }

Y aquí está la función alrededor de la línea 4473:

 if (parent) {
    parent.replaceChild(newNode, oldNode);
  }

Pude solucionar el primer error que encontré:

Unhandled exception at line 2031
 JavaScript runtime error: Unable to add dynamic content

envolviendo todo angular.js con MSApp.execUnsafeLocalFunction

  MSApp.execUnsafeLocalFunction(function () {
          ....
      });   

Estos errores provienen de una aplicación de prueba que creé siguiendo el ejemplo de lista de tareas pendientes de la página principal de Angular.js.

¿Ahora que? De acuerdo con un evento gratuito de Microsoft al que asistí, "¡es fácil agregar cualquier framework / biblioteca de JavaScript a una aplicación de Windows 8!" Puedo ser nuevo en esto ... ¡pero no creo que esto sea muy fácil!

¿Es posible utilizar Angular.js con una aplicación de Windows 8?

Answer 1

La razón es porque Angular pone etiquetas html comment <!-- --> para ng-repeat y directivas similares. Desafortunadamente, Microsoft considera que no es seguro cuando se lo coloca desde Javascript con .innertHTML y no está permitido. Esto puede ser encontrado aquí:

http://msdn.microsoft.com/en-us/library/windows/apps/hh465388.aspx

Sucede en la línea 1534 en jQLite:

var div = document.createElement(''div'');
            // Read about the NoScope elements here:
            // http://msdn.microsoft.com/en-us/library/ms533897(VS.85).aspx
            div.innerHTML = ''<div>&#160;</div>'' + element; // IE insanity to make NoScope elements work!
            div.removeChild(div.firstChild); // remove the superfluous div

Lo que sucede es que el elemento es

<!-- ngRepeat: item in arrayTest -->

Entonces cuando angular hace div.innerHTML = ... el elemento se elimina. Si pones un punto de quiebre en div.removeChild, verás que div.innerHTML está sin el elemento.

[EDIT] Después de escribir esta respuesta intenté agregar

MSApp.execUnsafeLocalFunction(function () { div.innerHTML = ''<div>&#160;</div>'' + element });

¡Funciona! Aparentemente debes envolver todos los angularjs en MSApp.execUnsafeLocalFunction y luego en esa línea específicamente.

Answer 2

en mi caso, envolví angularjs con MSApp.execUnsafeLocalFunction y solo usé data-ng-repeat en lugar de ng-repeat

Answer 3

Lo conseguí trabajando agregando ng-csp a la etiqueta HTML en la aplicación de mi tienda. Esto habilita la Política de seguridad de contenido, que desactiva cosas como ''eval''. Usé jQuery (v2.1.1) y Angular (v1.3.0-beta.13).

Más sobre ng-csp en la documentación de AngularJS .