做angular demo报错: Uncaught Error: Unexpected directive 'ScrollSpyDirective' imported by the module 'AppModule'. Please add a @NgModule annotation。解决问题时发现对@NgModule中import、declarations、providers这三个配置信息理解不是很到位。特此整理下。

每个模块的@NgModule中都会包含import、declarations、providers三个配置节,他们的具体含义为:

import当前模块导入的其他模块,import应该导入的是module,而不是compnents或者services

declarations:当前模块内包含的公共组件、指令信息。declarations生命的是components,而不是module或者services

providers:当前模块可以使用的公共服务(可以为本模块内提供的服务,也可以是其他npm包中导入的服务)。provider提供的应该是services,而不是compnents或者modules。

了解了以上信息此问题的原因就很清晰了,ScrollSpyDirective属于本模块内的组件。引入ScrollSpyDirective应该在declarations中生命而不应该在import中引入。

Unexpected directive 'XXX' imported by the module 'AppMoode'的更多相关文章

  1. Angular4.0 项目报错:Unexpected value xxxComponent' declared by the module 'xxxxModule'. Please add a @Pipe...

    最近刚刚开始学习angular 4.0,在网上找了一个小项目教程学习,然而学习的过程有点艰辛,,各种报错,我明明就是按照博主的步骤老老实实走的呀!!话不多说,上bug-  .- Uncaught Er ...

  2. Refused to execute inline event handler because it violates the following Content Security Policy directive: "xxx". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...')

    /********************************************************************************* * Refused to exec ...

  3. Angular5 import interface 报错:XXX is not a module

    在项目里定义了一个interface,device.ts.然后在component.ts中要使用这个interface,import之后,VSCode报错:‘xxx/xxx/xxx/device.ts ...

  4. Vue自定义指令报错:Failed to resolve directive: xxx

    Vue自定义指令报错 Failed to resolve directive: modle 这个报错有2个原因: 1.指令单词拼错 2.Vue.directive() 这个方法没有写在 new Vue ...

  5. Angular2-------Error: Unexpected value ‘undefined’ declared by the module ‘模块名

    请检查[app.module.ts]文件中的[declarations]模块最后是否多了一个逗号 (完)

  6. python学习笔记之module && package

    个人总结: import module,module就是文件名,导入那个python文件 import package,package就是一个文件夹,导入的文件夹下有一个__init__.py的文件, ...

  7. node.js中module.export与export的区别。

    对module.exports和exports的一些理解 可能是有史以来最简单通俗易懂的有关Module.exports和exports区别的文章了. exports = module.exports ...

  8. 通过angularjs的directive以及service来实现的列表页加载排序分页

    前两篇:(列表页的动态条件搜索,我是如何做列表页的)分别介绍了我们是如何做后端业务系统数据展示类的列表页以及动态搜索的,那么还剩下最重要的一项:数据展示.数据展示一般包含三部分: 数据列头 数据行 分 ...

  9. [AngularJS] Directive using another directive by 'require'

    Directive can use another directive though 'require' keyword. angular.module('docsTabsExample', []) ...

随机推荐

  1. 《Python编程从入门到实践》--- 学习过程笔记(2)变量和简单数据类型

    一.变量无需声明 二.变量命名规则 (1)变量名只能包括字母.数字和下划线: (2)变量名不能包含空格: (3)变量名不能使用Python关键字和函数名(保留字不可以做变量名); (4)简短易懂,清晰 ...

  2. Docker三剑客之常用命令

    一.docker-machine 命令 说明 docker-machine create 创建一个 Docker 主机(常用-d virtualbox) docker-machine ls 查看所有的 ...

  3. POJ 2871

    #include<iostream> #include<stdio.h> #include<iomanip> using namespace std; int ma ...

  4. 剑指offer十九之顺时针打印矩阵

    一.题目 输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字1,2, ...

  5. C#:自定义函数

    将数组转成字符串 /// <summary> /// 将数组转成字符串 /// </summary> /// <param name="glue"&g ...

  6. 使用binlog2sql针对mysql进行数据恢复

    MySQL闪回原理与实战 DBA或开发人员,有时会误删或者误更新数据,如果是线上环境并且影响较大,就需要能快速回滚.传统恢复方法是利用备份重搭实例,再应用去除错误sql后的binlog来恢复数据.此法 ...

  7. Glide图片加载库的使用

    http://www.cnblogs.com/whoislcj/p/5558168.html这篇文章写得很详细,我这里简单说一些 1.app的build.gradle的dependencies里面添加 ...

  8. 【转】谷歌三大核心技术(二)Google MapReduce中文版

      Google MapReduce中文版     译者: alex   摘要 MapReduce 是一个编程模型,也是一个处理和生成超大数据集的算法模型的相关实现.用户首先创建一个Map函数处理一个 ...

  9. linux下mysql5.7以上my.cnf配置文件配置

    简单配置,低配置服务器配置 [client] #客户端设置 port = 3306 socket = /data/mysql/data/mysql.sock default-character-set ...

  10. tensorflow 在同一个GPU同时加载多张相同的图

    saver = self.tf_instance.train.Saver() self.sess = self.tf_instance.Session(config=sess_config, grap ...