如何从Electron JS中的代码加载角度路线?

时间:2019-03-22 22:33:59

标签: angularjs routes electron

我用Angular JS和angular-route.js编写了一个简单的Electron JS应用程序。路由从链接(例如<a href="#!/route1">Route 1</a>)开始工作,但是我不知道如何触发代码中的路由更改。如果使用的是纯JavaScript,我可以使用$location.path来实现。但这似乎不适用于电子内部。我也没有与loadFile和loadURL的任何运气。

我只是使用了错误的路由API(我见过一些)还是做错了?

我的代码:

var app = angular.module("app", ['ngRoute']);

app.config(['$locationProvider', '$routeProvider',
    function config($locationProvider, $routeProvider) {
        $locationProvider.hashPrefix('!');		        
		
		console.log("Config is running");
		
        $routeProvider.when('/route1', {			
            templateUrl: 'route1.html' 
        }).when('/route2', {
			controller: "route2Controller",
            templateUrl: 'route2.html'
        }).when('/route3', {
			
			templateUrl: 'route3.html'
        }).otherwise({
			
            templateUrl: 'route1.html'
        });
    }

]);

app.controller("route2Controller", function($scope) {
	
	console.log("route2Controller fired");
	
	const { BrowserWindow } = require('electron').remote;

	//these three lines work, so I know I've got the BrowserWindow alright.
	//let win = new BrowserWindow({ width: 800, height: 600 });	
	//win.on('closed', () => { win = null });	
	//win.loadFile('index.html');
	
	// But this doesn't change to route #3
	BrowserWindow.getFocusedWindow().loadURL('#!/route3');
	
	//This just gets me a blank window
	BrowserWindow.getFocusedWindow().loadFile('index#!/route3');
		
});
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
	
	<script
		src="http://code.jquery.com/jquery-3.3.1.min.js"
		integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
		crossorigin="anonymous"></script>


	
  </head>
  <body ng-app="app">
    <a href="#!/route1">Route 1</a>
	<a href="#!/route2">Route 2</a>
	<a href="#!/route3">Route 3</a>

	<div ng-view></div>
	
	<script id="route1.html" type="text/ng-template">
		Route # 1	
	</script>
	
	<script id="route2.html" type="text/ng-template">
		Route # 2
	</script>
	
	<script id="route3.html" type="text/ng-template">
		Route # 3
	</script>
	
  </body>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular-route.js"></script> 
	<script src="app.js"></script>
	
</html>

谢谢!

0 个答案:

没有答案