Question

我的NW.js应用程序中有以下html结构

<div id="nav-header">
    <!-- bunch of links -->
</div>
<div id="content"></div>
<div id="footer"></div>

当用户点击#nav-header中的链接时，我正在尝试找到“动态更改”或“从其他html文件加载”内容div的方法。我知道在网络应用程序中这是用ajax完成的，但我不知道如何在NW.js桌面应用程序中执行此操作，并且无法找到有关如何执行此操作的任何线索。

有人可以帮我这个吗？

Answer 1

你可以像在网上一样做到这一点。您可以使用ajax并调用本地文件，AngularJS将是一个易于实现的解决方案。

例如：

项目结构：

的package.json

的index.html

page1.html

<强>的index.html

<html ng-app>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.3/angular.min.js"></script>
</head>
<body ng-init="page = 'page1.html'"> <!-- Default page -->
    <div id="nav-header">
    <nav>
        <a ng-click="page = 'page1.html'">Link 1</a>
        <a ng-click="page = 'page2.html'">Link 2</a>
        <a ng-click="page = 'page3.html'">Link 3</a>
    </nav>
    </div>
    <div id="content" ng-include="page"></div>
    <div id="footer"></div>
</body>
</html>

<强> page1.html

<div>Hello World</div>

当然如果你要使用棱角分明的话我建议你使用类似Angular UI Router的路由器但正如你所看到的那样，你可以用你知道的任何其他技术在网上工作，NW.js仍然是镀铬的。

nwjs应用程序中的局部视图

1 个答案: