Question

我目前正在尝试构建一个教育性的单页Web应用程序，它将使用Angular作为前端，使用Sails.js作为后端。我正在使用Angular app模板here。

我想将它集成到一个Sails.js项目中，我甚至仔细阅读并尝试了Stack Overflow上this thread的所有答案，这些答案涵盖了一个类似的问题，但似乎没有一个答案对我有用。我能够使用该主题上的＃1答案将index.html中的代码用作我的主页视图，但是当它加载时它只加载html（尽管事实上我将所有的css链接起来）。

它也不会加载所有Angular功能（例如：如果你点击链接，例如注册页面，它会在页面底部加载html，但不会隐藏其他元素）。

我怎么可能解决这个问题？

注意：如果需要额外的信息来回答这个问题，请询问，我很乐意提供。

编辑：

所以这可能会有所帮助（Sails.js项目的文件结构和使用Yeoman生成的Angular Web应用程序模板的文件结构）：

Sails.js项目文件结构：

API

适配器/

控制器/

模型/

政策/

服务/



资产

图像/

JS /

形式/

的favicon.ico

的robots.txt



配置/

node_modules /

的观点

家/

403.ejs

404.ejs

500.ejs

layout.ejs



Gruntfile.js

app.js

的package.json

Angular单页网页应用模板文件结构：

应用

404.html

资产/

bower_components /

的favicon.ico

favicon.png

字体/

图像/

的index.html

的robots.txt

脚本/

形式/

视图/



bower.json

DIST /

Gruntfile.js

果报e2e.conf.js

karma.conf.js

节点模块/

的package.json

预建/

自述

README.TXT

测试/

顺便说一句，dist和prebuilt文件夹与app文件夹相对相同。唯一的区别是dist文件夹是为生产和预建文件夹（显然）构建的应用程序的预构建/示例版本。

Answer 1

首先确保Sails将在构建应用程序时加载Angular应用程序文件，以确保javascript，css和html文件位于等效Sails文件夹下的assets文件夹中。因此，角度javascript文件应位于assets / js下，资产/样式中的css文件和assets文件夹中可访问的html文件。

要包含bower_components，最好将它们复制到资源下的文件夹中，例如，名为assets / vendor的文件夹，grunt-bower-task可用于此目的。

Sails构建过程应包括bower_components，因此更改tasks / pipline.js中的以下行：

// CSS files to inject in order
//
// (if you're using LESS with the built-in default config, you'll want
//  to change `assets/styles/importer.less` instead.)
var cssFilesToInject = [
  'vendor/**/*.css',
  'styles/**/*.css'
];


// Client-side javascript files to inject in order
// (uses Grunt-style wildcard/glob/splat expressions)
var jsFilesToInject = [

  'vendor/angular/*.js',
  'vendor/angular-*/*.js',

  // Load sails.io before everything else
  'js/dependencies/sails.io.js',

  // Dependencies like jQuery, or Angular are brought in here
  'js/dependencies/**/*.js',

  // All of the rest of your client-side js files
  // will be injected here in no particular order.
  'js/**/*.js'
];

我已经创建了一个模板来实现Angular tutorial PhoneCat应用，您可以将其克隆并用作基础：https://github.com/oferh/ayooni

将单页角度应用程序模板集成到Sails.js中

编辑：

1 个答案: