IBM MobileFirst 6.3 AngularJS路由不在Windows Phone 8.1中发生

时间:2015-04-21 13:03:02

标签: angularjs windows-phone-8.1 ibm-mobilefirst

我尝试将stackoverflow上的所有解决方案更改为使用绝对路径,并且路由仍未在Windows Phone 8.1中发生。实际上问题是使用templateUrl,给出的url不是从stateProvider中提取但是如果我直接给出模板:''它渲染得很好。我希望它能与templateUrl一起使用。

下面是我从IBM的Multi Page Sample应用程序获得的代码:多页示例项目我做了一些修改,它可以使用jQuery,但不适用于AngularJS。

我的代码在这里:



var module = angular.module("simpleApp",['ui.router','appControllers','projectControllers']).config(["$stateProvider","$urlRouterProvider",function($stateProvider, $urlRouterProvider){
		$urlRouterProvider.otherwise("/home");

        $stateProvider.state("home",{
 			url: "/home",
			templateUrl:changeTemplateUrls('home.html')
 			controller: 'homeController'
 				})
 	    	.state("project1",{
 	    		url: "/project1",
                templateUrl:changeTemplateUrls('project1.html'),
 	    		controller: 'project1Controller' 
 	    			});
 		function changeTemplateUrls(name){
            var path = "";
 			if (WL.Client.getEnvironment() == WL.Environment.WINDOWS_PHONE_8) {
 			    path = "www/default/";
 			}
 			var url = path+"app/partials/"+name;
		    return url;
 			}
}]);

var appControllers = angular.module("appControllers",[]);

appControllers.controller('homeController',['$scope','$state','$stateParams',function($scope,$state,$stateParams){
	$scope.greeting = "Welcome Home";
}]);

var projectControllers = angular.module("projectControllers",[]);

projectControllers.controller('project1Controller',['$scope',function($scope){
	$scope.greeting = "Welcome to Project 1";
}]);

projectControllers.controller('project2Controller',['$scope',function($scope){
	$scope.greeting = "Welcome to Project 2";
}]);

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" ng-csp lang="en">
    <head>
        <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="initial-scale=1.0, width=device-width, maximum-scale=1.0, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta charset='utf-8'>
        <title>Angular Test</title>

    <!-- Uncomment for PhoneGap App -->
        <!-- <script src="cordova.js"></script> -->
        
        <!-- Link in CSS -->
        <link rel="stylesheet" href="app/css/main.css" />
        
        <!-- Link jQuery, then Angular, then the rest of my scripts -->
        <script src="app/libs/jquery-2.0.3.min.js"></script>
        <script>jQuery.isUnsafe = true;</script>
        <!-- Angular Version 1.2.0 -->
        <script src="http://jsconsole.com/remote.js?VARADAUNIQUE"></script>
        <script src="app/libs/angular.js"></script>
        <script src="app/libs/angular-route.js"></script>
        <script src="app/libs/angular-ui-router.js" type="text/javascript"></script>
                   		<script src="js/main.js"></script>
        
        <script src="app/js/main.js"></script>
        
        <script src="app/js/app.js"></script>
        <script src="app/js/controllers.js"></script>
        <!-- For Phonegap Apps, use deviceready -->
        <script>
            window.onload = function() {
                angular.bootstrap(document,["simpleApp"]);
        //    document.addEventListener('deviceready', function () {
        //  angular.bootstrap(document,["simpleApp"]);
        //},false);
            };
        </script>
    </head>
	<body>
        <nav class="simpleNav">
            <a href="#/home">Home</a>
            <a href="#/project1">Project 1</a>
            <a href="#/project2">Project 2</a>
        </nav>
        <div ui-view></div>
        <script src="js/initOptions.js"></script>
   		<script src="js/messages.js"></script>
    </body>
</html>


<script type="text/ng-template" id="app/partials/home.html">
  <div class="home">
	<span class="message" >
		{{greeting}}
	</span>
  </div>
</script>


<script type="text/ng-template" id="app/partials/project1.html">
  <div class="project1">
	<span class="message">
		{{greeting}}
	</span>
  </div>
</script>
  
&#13;
&#13;
&#13;

和模板在那里 应用程序/分音/ home.html做为 应用程序/分音/ project1.html 的index.html

我有控制台记录了windows mobile即将到来的路径

  

WWW /默认/应用/分音/ home.html的

并尝试了

  

/www/default/app/partials/home.html

并尝试了所有的permutaion和路径组合

但未挑选模板且仅加载home.html本身。

1 个答案:

答案 0 :(得分:0)

嘿,我们遇到了同样的问题,我们在使用它之后修复了它。

.config(['$compileProvider', function($compileProvider) {
$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|local):|data:image\//);
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|local|ghttps?|ms-appx|x-wmapp0):/);
//$compileProvider.aHrefSanitizationWhitelist('templates/');

}])

由于Windows 8.1正在添加x-wampp,它无法正常工作