2012-10-09 20 views
14

Aplikacja działa, ale obiekty danych kątowych nie są rozpoznawane.Jak uzyskać Angular.js do pracy w aplikacji sklepu Windows 8?

Oto błąd JavaScript otrzymuję:

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). 

Oto funkcja wokół linii 1059 w angularjs:

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

I tu jest funkcja wokół linii 4473:

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

Udało mi się naprawić pierwszy błąd, który napotkałem:

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

owijając wszystkich angularjs z MSApp.execUnsafeLocalFunction

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

tych błędów z aplikacji testowej, który został utworzony na wzór listęzadańz od głównej angularjs.

Co teraz? Zgodnie z bezpłatnym Wydarzeniem Microsoft, w którym brałem udział, "Łatwo jest dodać dowolny framework/bibliotekę JavaScript innej firmy do aplikacji Windows 8!" Mogę być nowy w tym ... ale nie sądzę, że to bardzo proste!

Czy można nawet używać Angular.js z aplikacją Windows 8?

Odpowiedz

23

Powód jest taki, że Angular wstawia znaczniki html <!-- --> dla dyrektyw ng-repeat i podobnych. Niestety, Microsoft uważa, że ​​nie są one bezpieczne, gdy zostaną wprowadzone z Javascriptu przy użyciu .innertHTML i nie są dozwolone. To można znaleźć tutaj:

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

Zdarza się na linii 1534 w 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 

Co się dzieje, jest elementem jest

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

Wtedy gdy kątowe robi div.innerHTML = ... element zostanie usunięty. Jeśli umieścisz punkt przerwania w div.removeChild, zauważysz, że div.innerHTML jest bez elementu.

[EDIT] Po napisaniu tej odpowiedzi Próbowałem dodanie

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

To działa! Wygląda na to, że musisz zawinąć wszystkie angulary w MSApp.execUnsafeLocalFunction, a następnie dokładnie tę linię.

+2

Jak to nie jest w kątowych dokumentach. Czy to nie problem dla wszystkich używających powtórzeń ng? – morgs32

+0

To tylko problem dla osób, które tworzą aplikacje dla Windows 8 w HTML5. To nie jest to, czego większość ludzi używa w Angular. – wmil

+1

I dla przypomnienia, możesz teraz użyć shim (https://github.com/codemonkeychris/angular-winjs), aby Angular grał dobrze z aplikacjami Windows i Windows Phone. –

1

w moim przypadku owinięty angularjs z MSApp.execUnsafeLocalFunction i użyłem tylko data-NG-repeat zamiast ng-powtórzyć

4

mam to działa dodając ng-csp do tagu HTML w moim app store. Umożliwia to Politykę bezpieczeństwa treści, która wyłącza takie funkcje, jak "eval". Użyłem jQuery (v2.1.1) i Angular (v1.3.0-beta.13).

Więcej o ng-csp w AngularJS documentation.

Powiązane problemy