Làm thế nào để bạn có được Angular.js để làm việc trong một ứng dụng cửa hàng Windows 8?

Question

Ứng dụng chạy nhưng các đối tượng dữ liệu Góc không được nhận dạng.

Dưới đây là lỗi JavaScript Tôi nhận:

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

Dưới đây là chức năng xung quanh dòng 1059 trong angular.js:

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

Và đây là chức năng xung quanh dòng 4473:

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

Tôi có thể khắc phục lỗi đầu tiên mà tôi gặp phải:

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

bằng cách gói tất cả các angular.js với MSApp.execUnsafeLocalFunction

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

Những lỗi này là từ một ứng dụng thử nghiệm mà tôi tạo ra theo tấm gương danh sách todo từ trang chủ Angular.js.

Bây giờ làm gì? Theo một sự kiện Microsoft miễn phí mà tôi đã tham dự, "Thật dễ dàng để thêm bất kỳ khung thư viện JavaScript/bên thứ ba nào vào ứng dụng Windows 8!" Tôi có thể mới với điều này ... nhưng tôi không nghĩ rằng điều này là rất dễ dàng!

Thậm chí có thể sử dụng Angular.js bằng ứng dụng Windows 8 không?

Answer 1

Lý do là vì Angular đặt nhận xét html <!-- --> thẻ cho lệnh ng-repeat và tương tự. Thật không may Microsoft coi những điều này là không an toàn khi được đưa vào từ Javascript bằng cách sử dụng .innertHTML và không được phép. Điều này có thể được tìm thấy ở đây:

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

Nó xảy ra tại dòng 1534 trong 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 

gì xảy ra là nguyên tố này là

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

Sau đó, khi góc làm div.innerHTML = ... phần tử bị xóa. Nếu bạn đặt một điểm break tại div.removeChild, bạn sẽ thấy div.innerHTML không có phần tử.

[EDIT] Sau khi viết phản ứng này tôi đã cố gắng thêm

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

Nó hoạt động! Rõ ràng bạn phải bọc tất cả các angularjs trong MSApp.execUnsafeLocalFunction và sau đó là dòng cụ thể.

Answer 2

trong trường hợp của tôi, tôi quấn angularjs với MSApp.execUnsafeLocalFunction và tôi chỉ sử dụng dữ liệu-ng-repeat thay vì ng-lặp lại

Answer 3

tôi nhận nó làm việc bằng cách thêm ng-csp vào thẻ HTML trong ứng dụng cửa hàng của tôi. Điều này cho phép Chính sách bảo mật nội dung, vô hiệu hóa những thứ như 'eval'. Tôi đã sử dụng jQuery (v2.1.1) và Angular (v1.3.0-beta.13).

Thông tin thêm về ng-csp trong số AngularJS documentation.