防爆preSS + AngularJS + HTML：NG-包括不工作（404 - 找不到页错误） [英] Express + AngularJS + HTML: ng-include not working (404 - Page not found error)

问题描述

我是新来的 AngularJS 。我试图用 NG-包括，包括在我的主HTML页面的外部HTML页面。但问题是我不能够把它列入并获得404以下是文件夹结构和code，

项目的文件夹结构：

buttonClick.jade （这是起始页。）

  DOCTYPE HTML
HTML（NG-APP）
    头
        链接（相对=样式表中，href ='/样式表/ bootstrap.min.css'）
        链接（相对=样式表中，href ='/样式表/ style.css文件'）
        脚本（SRC =/ JavaScript的/ angular.min.js'）
    体（类=炫魅）
        //包括footer.html
        包括pageinclude.html
 

pageinclude.html

 ＆LT; D​​IV＆GT;
    ＆LT; D​​IV＆gt;包含页面演示＆LT; / DIV＆GT;
    ＆LT; D​​IV NG-包括='footer.html'＆GT;＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

注意：

1）当我直接包含 footer.html 页中的.jade文件，那么它工作正常。但是，当我使用NG-包括在HTML做同样的文件，这是行不通的。

2）我也曾尝试以下NG-包括方式，

 ＆LT; D​​IV NG-包括='footer.html'＆GT;＆LT; / DIV＆GT;
＆LT; NG-包括SRC ='footer.html'＆GT;＆LT; / NG-包括＆GT;
 

解决方案

NG-包括是一个客户端包含，因此该路径包含的HTML文件是相对的到URL的客户感知。

由于翡翠是抽象的文件夹结构，并没有对您的提供直接访问视图文件夹，你应该把包含的HTML文件上的公开文件夹，就像任何externaly访问的文件。

当您在您的.jade文件页脚（按注2）你在做一个服务器端包括使用服务器的目录结构。

I am new to AngularJS. I am trying to use ng-include to include an external HTML page in my main HTML page. But the problem is I am not able to include it and getting 404. Following is the folder structure and the code,

Project Folder Structure:

buttonClick.jade (This is the starting page.)

doctype html
html(ng-app)
    head
        link(rel='stylesheet', href='/stylesheets/bootstrap.min.css')
        link(rel='stylesheet', href='/stylesheets/style.css')
        script(src='/javascripts/angular.min.js')
    body(class="mainPage")
        //include footer.html
        include pageinclude.html

pageinclude.html

<div>
    <div>Include Page Demo</div>
    <div ng-include="'footer.html'"></div>
</div>

Note:

1) When I include footer.html page directly in the .jade file then it is working fine. But when I do the same using ng-include in the HTML file it does not work.

2) I have also tried the following ng-include ways,

<div ng-include="'footer.html'"></div>
<ng-include src="'footer.html'"></ng-include>

解决方案

ng-include is a client side include and as such the path to the included html file is relative to the client perception of the url.

Since jade is abstracting your folder structure and does not provide direct access to your views folder you should probably put the included html file on the public folder just as any externaly accessible file.

When you include the footer in your .jade file (As per Note 2) you are doing a server side include which uses the server directory structure.

这篇关于防爆preSS + AngularJS + HTML：NG-包括不工作（404 - 找不到页错误）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！