【问题标题】:Directives do not work after adding dependencies to module将依赖项添加到模块后指令不起作用
【发布时间】:2015-12-21 11:57:46
【问题描述】:

我正在开发由节点服务器提供的 Angular 应用程序,并且我正在尝试在 core.js 文件中包含依赖项。在我向模块添加依赖项之前,一切都运行良好。一旦我向模块添加依赖项,指令就会由于某种原因停止工作。更具体地说,我要添加的依赖项是 btford.socket-io 并与 bower 一起安装。

我已经尝试通过括号添加它,如下所示,app.requires 也可以在下面的评论中看到。控制台中显示的错误是[$injector:modulerr]

这是我的 core.js 文件:

var app = angular.module('test', ['btford.socket-io']);
// app.requires.push('btford.socket-io');

app.controller('testController', function ($scope, $http) {
    $scope.test = "This is test.";

    $scope.loadData = function() {
        $http.get('/data').success(function(data) {
            $scope.data = data;
        });
    };

    $scope.loadData();
});

这是 layout.jade:

doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js')
    script(src='http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js')
    script(src='/socket.io/socket.io.js')
    script(src='javascripts/core.js')
  body(ng-app="test")
    block content

这里是 index.jade:

extends layout

block content
    div(ng-controller="testController")
        p {{test}} Result should be 15 and is: {{5 + 10}}
        br
        p {{data[0].name}}

在添加依赖指令之前显示预期结果:

This is test. Result should be 15 and is: 15
MyName

但添加依赖后,它们只是显示为纯文本,错误[$injector:modulerr]

{{test}} Result should be 15 and is: {{5 + 10}}
{{data[0].name}}

有谁知道为什么会这样,我怎样才能让它发挥作用?

【问题讨论】:

  • 我在你的 html 中没有看到任何脚本加载 btford.socket-io 模块。
  • @Deblaton Jean-Philippe 我刚刚更新了问题。
  • @JB Nizet 我应该如何添加它?为什么通过模块依赖添加还不够?
  • @Miljac 您应该检查 Web 浏览器控制台以查看您遇到的错误(如果有)。 Ctrl + alt j (windows) 和 Cmd + option + j on (mac) 或有时 F12 后跟控制台选项卡。如果您有任何错误,请将错误添加到问题中。
  • 像任何其他脚本一样:通过将

标签: angularjs node.js angularjs-directive pug


【解决方案1】:

如 cmets 中所述,将 <script> 标签添加到 HTML 解决了它。

唯一需要注意的是,我必须将 app.use(express.static(path.join(__dirname, 'bower_components'))); 添加到 app.js 才能使用想要的路由

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-12-08
    • 2011-06-30
    • 1970-01-01
    • 2017-12-15
    • 1970-01-01
    • 2014-12-17
    • 2019-04-11
    • 1970-01-01
    相关资源
    最近更新 更多