错误:$compile:tpload 无法加载模板 Http 状态:404

2024-04-24

当我尝试使用 Angular 运行本地项目时,我从 Chrome 收到 404 状态。我不确定问题出在哪里,并且我已经尝试过类似问题的建议答案。

这是我的指令文件:

'use strict';

/**
 * @ngdoc directive
 * @name stockDogApp.directive:stkWatchlistPanel
 * @description
 * # stkWatchlistPanel
 */
angular.module('stockDogApp')
  .directive('stkWatchlistPanel', function ($location, $modal, WatchlistService) {
    return {
      templateUrl: 'views/templates/watchlist-panel.html',
      restrict: 'E',
      scope : {},
      link: function($scope){
        $scope.watchlist = {};
        var addListModal = $modal({
          scope : $scope,
          template: 'views/templates/addlist-modal.html',
          show : false

        });

        $scope.watchlists = WatchlistService.query();

        $scope.showModal = function(){
          addListModal.$promise.then(addListModal.show);
        };
        $scope.createList = function(){
          WatchlistService.save($scope.watchlist);
          addListModal.hide();
          $scope.watchlist = {};
        };
        $scope.deleteList = function(list){
          WatchlistService.remove(list);
          $location.path('/');
        };
      }
    };
  });

这是我的“app”文件夹的树视图

|-- 404.html
|-- favicon.ico
|-- images
|   `-- yeoman.png
|-- index.html
|-- robots.txt
|-- scripts
|   |-- app.js
|   |-- controllers
|   |-- directives
|   |   `-- stk-watchlist-panel.js
|   `-- services
|       `-- watchlist-service.js
|-- styles
|   `-- main.css
`-- views
    `-- templates
        |-- addlist-modal.html
        `-- watchlist‐panel.html

当我在控制台中加载 index.html 时,出现页面未找到错误。

Error: [$compile:tpload] Failed to load template: views/templates/watchlist-panel.html (HTTP status: 404 Not Found)
http://errors.angularjs.org/1.4.4/$compile/tpload?p0=views%2Ftemplates%2Fwatchlist-panel.html&p1=404&p2=Not%20Found

我还尝试输入根文件夹的完整路径,但仍然没有检测到该页面。

我不确定这是否是原因,但查看 chrome 开发人员工具显示源选项卡中没有应用程序文件夹(它只显示 'bower_components'、'scripts' 、 'styles' 和 index.html

**更新 **

看来 Angular 唯一看不到的文件夹是应用程序中的视图文件夹。我不确定问题出在哪里。 grunt 可能有问题吗?

ngtemplates: {
  dist: {
    options: {
      module: 'stockDogApp',
      htmlmin: '<%= htmlmin.dist.options %>',
      usemin: 'scripts/scripts.js'
    },
    cwd: '<%= yeoman.app %>',
    src: 'views/{,*/}*.html',
    dest: '.tmp/templateCache.js'
  }
},

我想这是因为你写的template: 'views/templates/addlist-modal.html'代替templateUrl: 'views/templates/addlist-modal.html'

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

错误:$compile:tpload 无法加载模板 Http 状态:404 的相关文章

随机推荐

  • activerecord - 如何获取连接表的所有列

    看完之后 this http guides rubyonrails org active record querying html using array hash of named associations 我还是不明白 在控制台中 pu
  • 为什么我的 pxd 文件的 Cython cimport 不起作用?

    我是 Cython 的新手 所以我可能会遗漏一些明显的东西 但我已经通读了文档并对此进行了一段时间的思考 我有一个 pyx我使用构建的文件setup py文件如下 from distutils core import setup from
  • hbase api - 通过行ID列表获取数据行信息

    是否可以通过hbase java API通过行id列表获取hbase数据记录 例如 我有一个已知的 hbase 行 ID 列表 mykey1 myhash1 mykey1 myhash2 mykey1 myhash3 mykey2 myha
  • 从 VS2015 打开 TFS 查询到 MS Excel 时出错(TF80068)

    当我们尝试使用 VS2015 中的 在 Microsoft Excel 中打开 功能在 Excel 中打开 TFS 查询结果时 我们收到错误 TF80068 Team Foundation 在与服务器通信时遇到错误 请检查您的连接并重试 E
  • ES6 带括号的箭头函数[重复]

    这个问题在这里已经有答案了 我在代码中遇到了一个小问题 这让我有点困惑 希望有人能解释为什么它会这样做 Code 1 sendText return this http get api map response Response gt re
  • 如何对使用 SimpleITK 读取的 DICOM 图像进行直方图均衡化

    我正在尝试对从 nii gz 文件读取的所有图像进行直方图均衡 我试过这段代码 import SimpleITK as sitk flair file content gdrive My Drive Colab Notebooks FLAI
  • 在ggplot2中的不同等高线图中保持相同的中断

    我正在使用 ggplot2 stat contour filled 函数创建数据不同子集的等高线图 然而 对于每种颜色 它都会产生不同的色标 这使得很难对它们进行比较 我尝试过使用 breaks 选项 但由于某种原因它不起作用 MWE 是
  • C 中的大于函数

    我知道这是一个古老的问题 您可能也遇到过这个问题 但我的解决方案中有一个错误 我不知道如何解决它 我需要编写一个比较两个整数的函数 我只允许使用操作 gt gt isGreater int x int y returns 1 if x gt
  • 将 HTML 选择元素转换为带有子菜单的树

    我想让一个选择元素有一个树形的子菜单 我希望它是这样的 source colinear com http www colinear com rmenu gif 有没有一个 jQuery 插件可以将 select 元素变成这种东西 这里有树插
  • 将 Elasticsearch 结果导出到 CSV 文件

    我正在尝试将使用以下查询找到的结果导出到桌面上的 CSV 中 这是我第一次使用 Elasticsearch 和 cURL 所以我对如何做到这一点感到困惑 from elasticsearch import Elasticsearch es
  • 在expect脚本中发送INSERT和F12

    我知道为了在期望脚本中发送返回 我会执行以下操作 send r What is the send command for the INSERT and F12 keys I ve looked online and cannot find
  • 使用Python将宏注入电子表格

    我有一个宏 我想使用一堆现有的电子表格 唯一的问题是电子表格太多了 手工做太费时间了 我已经编写了一个 Python 脚本来使用 pyWin32 访问所需的文件 但我似乎无法找到使用它来添加宏的方法 一个类似的问题here给出了这个答案 它
  • 我的用于邮寄表单的 php 脚本无法正常工作

    我正在尝试设置一个表单 将附件与电子邮件内容一起发送 但我不知道我在做什么 我对 PHP 完全陌生 刚刚学会了通过尝试和错误以及互联网上的教程来完成基本的邮件表单工作 但是 当涉及到附件时 现在我完全不知所措了 而且 尽管 PHP 脚本应该
  • Blazor 客户端 (WASM) 应用程序洞察

    Application Insights SDK 是否适用于 Blazor WASM 我正在尝试连接我的应用程序 但它不发送任何指标 即使在实例化 TelemetryClient 时 它也只是挂起 与 Blazor 服务器端不同 您不能只将
  • NSURLRequest http协议版本

    这是我今天提出的一个非常简单的问题 是否可以设置特定的HTTP协议版本NSURLRequest对象 例如 1 0 或 1 1 我在 telnet 上谈论的一个例子 pavlov pavlov telnet ya ru 80 Trying 8
  • BouncyCastle 类上的 NoClassDefFoundError

    在使用 BC 类的 Web 应用程序上一段时间后 我遇到了 NoClassDefFoundError java lang NoClassDefFoundError org bouncycastle util Pack at org boun
  • 错误:[ng:areq] 参数“MyCtrl”不是函数,未定义

    我是 Angularjs 的新手 我正在学习教程 但我在标题中遇到了错误 HTML 代码 div div div div
  • Outlook 添加、文本框、删除\退格键不起作用

    我开发了一个 Outlook 插件 自定义任务窗格 在用户控件中带有 Web 浏览器 当我在网络浏览器的文本框中写入内容时 退格键或删除按钮旁边的所有功能都运行良好 但我无法使用这些键 我是否遗漏了什么 我迟到了几年 但我设法解决了这个问题
  • 使用 SQL 语句更改忽略表添加列(如果不存在)

    我想向 mysql 表添加一个新列 但如果该列已存在 我想忽略该列的添加 我目前正在使用 ALTER IGNORE TABLE db tablename ADD COLUMN column name text NULL 但这会引发错误 ER
  • 错误:$compile:tpload 无法加载模板 Http 状态:404

    当我尝试使用 Angular 运行本地项目时 我从 Chrome 收到 404 状态 我不确定问题出在哪里 并且我已经尝试过类似问题的建议答案 这是我的指令文件 use strict ngdoc directive name stockDo