2013-10-25 9 views
6

Ich versuche, eine HTML5/JS/CSS3 App mit angularJS unter Windows 8.1 mit Visual Studio 2012 zu erstellen. Ich bin derzeit fest daran, Parameter an andere Ansichten zu senden.AngularJS und Windows 8 Routenfehler

Wenn googeln ich sehe mehrere Beispiele mit <a href="#/page/{{:pageId}}">link</a> Wenn ich dies in meiner Windows 8-Anwendung und klicken Sie auf den Link Ich bekomme den folgenden Fehler.

keine Apps installiert sind, diese Art von Link zu öffnen (unsicher)

Wenn ich den {{:pageId}} Code zwischen den A-Tags setzen sie ihre ID zeigt.

app.js

var myApp = angular.module('myApp', ['ngRoute', 'ngResource']); 

myApp.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when("/", { templateUrl: "views/home.html" }) 
     .when("/page/:pageId", { templateUrl: "views/page.html" }) 
     .otherwise({ redirectTo: "/" }); 
}]); 

Was für eine Lösung ist es, dieses Problem zu lösen?

--update--

ich etwas mehr Debugging getan haben. Im Browser funktioniert alles einwandfrei.

<a class="ng-binding" href="unsafe:ms-appx://3595d292-0235-47cd-8db7-cb3019f29114/www/index.html#/page/1" data-ng-href="#/page/1">Select</a> 

Sieht aus wie VS einige Code erweitert: in Visual Studio Ich habe folgendes gefunden. In der Quelle habe ich nicht den href Artikel

Ich habe den Link geändert und alles scheint in Ordnung, auch die richtige Variable geladen wird nur VS fügt "unsafe:" an der Vorderseite des Links.

+0

Die Bindung {{pageId}} 'sucht nach einer Eigenschaft mit dem Namen' pageId' auf dem '$ scope' Objekt Ihres Controllers. Haben Sie diese Eigenschaft in Ihrem Controller? Wenn dies nicht der Fall ist, wenn Angular den Ausdruck {{pageId}} auswertet, wird es herausfinden, dass pageId nicht definiert ist und Ihre Verknüpfung zu 'href =" #/page/"' ändern wird, zu der Sie keine Route haben definiert für das ... – tennisgent

+0

Wie lautet die URL in Ihrem Browser? Ist es Datei: // oder http: //? – HMR

+0

Entschuldigung für den späten Kommentar. Weil es alles HTML5 und JS ist, habe ich es im Browser getestet und dort funktioniert es perfekt. – Rik

Antwort

11

Problem gelöst!

scheint wie die ms-appx, die von ms hinzugefügt wird, verursacht das Problem. Dies wird durch Hinzufügen des folgenden Codes behoben.

AngularJS 1,2

app.config(['$compileProvider', function($compileProvider) { 
    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|ms-appx):/); 
}]); 

Für 1.1.x und 1.0.x verwenden urlSanitizationWhitelist.

Wenn Sie PhoneGap verwenden, denken Sie daran, eine Datei neben https hinzuzufügen? Andernfalls funktionieren die Links nicht.

+0

Wow great find, ich konnte keine gute Debugging-Umgebung erreichen, daher wusste ich nicht, dass auch ms-appx angehängt wurde. – jacobsgriffith

+0

genial .. das machte meinen Tag für das Windows-Ziel unseres Cordova-Projekts – EeKay