在angular中引入编辑器的时候花了很长时间,然后发现自己以前根本就没好好用过angular,因为项目是接手的学姐的,学姐又是接手的学姐的,到我这里就只是写写页面的事了。

引入编辑器差了好多好多资料,因为controller这个东西卡住了好久好久,前几天看了两节angualr的视频才有一点点的接触到controller,然后今天理解了一下下就搞出来了,其中遇到过的报错,不只有一下三种。。。时间跨度太久,没有记录下了。

1.项目中找不到angular-cli.json,也找不到angular.json

查到引入tinymce编辑器时,要配全局访问?然后就是找不到这个文件,我查了一下项目的版本好像是v1.5.0。得再研究下子。。。。

2.

后来全局安装tinymce,添加控制器我真的搞了好久,教程是写在js里,我找了好久才发现这个项目的控制器写在哪里。

教程一般都是这样写的:

var app = angular.module('app', ['ui.tinymce'])
app.controller("editorController", function( $scope ) {
$scope.tinymceOptions = {
            //配置回调的事件
handle_event_callback : function(e) {
console.log(e);
}
};
$scope.tinymceModel = "niceMCE"//初始化绑定的值
}); 声明一个模块,模块里声明控制器。我先是直接在我项目中的js文件中写的如上,然后html绑定这个控制器,控制台就会报错找不到这个控制器。
我以前以为绑定这个控制器跟我项目中引入的promptBox一样,这个写在congfig.js文件下,于是我换了个思路把上上面那段代码也写在这个文件里,显然还是不行的。
今天在绑定模块ng-app时才发现在index.html中已经包含了一个ng-app,同时这个目录下的app.js文件下那个一直存在但我不明白的变量GNAR的定义方法就是以定义模块的方法定义的。
然后查资料,说angularjs 中只能有一个模块module(ng-app=""),一个模块可以有多个控制器(ng-controller="")
今天才找到的,GNAR原来就是项目里添加过的模块。于是我把ui.tinymce加到了app.js中定义GNAR的地方。

3.

然后在页面中对应的js文件中,我也琢磨了一会,项目中配置对应js的时候是这样配置的:

我原本把‘editorController’加到了上代码的[ ]中,于是就报错了。查资料好像是引入了多个控制器,或者在控制器中引入了控制器。

我才想起在配置路由的时候,已经加了控制器,就叫‘’中的名字,我 在后面写‘editorController’应该就是把控制器写到了控制器里。

于是我才转过来,直接把引入编辑器之后的写在了后面的fanction中,就成功了!

我还要好好看一下控制器,搞这么久就说因为控制器都不了解,之前都没有研究过angular,上面可能理解还不对,但是引入还是成功了。

成果参考:

不明提供者的错误可能汇总:

https://blog.csdn.net/victoryzn/article/details/81302150

AngularJS中的Provider们:Service和Factory等的区别

https://segmentfault.com/a/1190000003096933?utm_source=tag-newest

引入编辑器:

https://www.cnblogs.com/diligenceday/p/4181982.html

angular 引入编辑器以及控制器的学习和理解。。。的更多相关文章

  1. angular 引入编辑器遇到的各种问题。。。

    1.项目中找不到angular-cli.json,也找不到angular.json 2. 3.

  2. 《疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践》学习笔记

    <疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践>学习笔记 二〇一九年二月十三日星期三2时28分54秒 前提:本书适合有初步HTML.CSS.JavaScri ...

  3. 用angular引入复杂的json文件2

    昨天我们也说了一下angular引入复杂json文件的方法,今天我们再来学习一种方法,而且更简单,更快捷. 首先我们引入一个angular插件,并且写上引入模块和控制台,在html中书写上模块名和控制 ...

  4. angular的GitHub Repository Directive Example学习

    angular的GitHub Repository Directive Example学习 <!DOCTYPE html> <html ng-app="myApp" ...

  5. 【中国象棋人机对战】引入了AI算法,学习低代码和高代码如何混编并互相调用

    以低代码和高代码(原生JS代码)混编的方式引入了AI算法,学习如何使用表达式调用原生代码的.整个过程在众触低代码应用平台进行,适合高阶学员. AI智能级别演示 AI算法分三个等级,体现出来的智能水平不 ...

  6. Vue.js学习与理解

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的库.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. Vue.js 自身不 ...

  7. SQL Server 学习博客分享列表(应用式学习 + 深入理解)

    SQL Server 学习博客分享列表(应用式学习 + 深入理解) 转自:https://blog.csdn.net/tianjing0805/article/details/75047574 SQL ...

  8. JDK学习---深入理解java中的HashMap、HashSet底层实现

    本文参考资料: 1.<大话数据结构> 2.http://www.cnblogs.com/dassmeta/p/5338955.html 3.http://www.cnblogs.com/d ...

  9. JDK学习---深入理解java中的LinkedList

    本文参考资料: 1.<大话数据结构> 2.http://blog.csdn.net/jzhf2012/article/details/8540543 3.http://blog.csdn. ...

随机推荐

  1. 大兄dei,早点看清this吧

    说道this,可以说是前端中很重要的问题之一了,也是面试或者笔试常考的问题.所以还是早点看清this吧,大兄dei. this是什么?为什么要存在? this关键字是js中最最复杂的机制之一.他被自动 ...

  2. gvim keil 快捷跳转至出现错误(警告)行

    开发环境 win7系统中:用keil 对工程进行编译链接,用gvim编辑查看源文件. 实现效果 一键跳转到出现警告或者错误的源码. 实现原理 gvim 调用外部shell脚本,对keil编译生成的lo ...

  3. Nginx Install 记录

    一.安装编译工具及库文件 yum -y install gcc yum -y install gcc-c++ yum -y install zlib; yum -y install pcre-deve ...

  4. P1342 请柬

    最近一直在做最短路......所以今天就再做一道最短路吧.... 题目描述 在电视时代,没有多少人观看戏剧表演.Malidinesia古董喜剧演员意识到这一事实,他们想宣传剧院,尤其是古色古香的喜剧片 ...

  5. selenium webdriver报错 ConnectionResetError: [WinError 10054] 远程主机强迫关闭了一个现有的连接。

    昨天跑的好好的代码,今天突然报错: ConnectionResetError: [WinError 10054] 远程主机强迫关闭了一个现有的连接. 调查一下,原来是Chrome自动升级,而chrom ...

  6. Recycle----项目总结

    github项目地址:https://github.com/HuChengLing/recycle 软件规模: 我们这个Recycle app属于一个小型项目,整体规模不大.预期有垃圾回收和二手品交易 ...

  7. python generator用法

    转自:https://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/0013868196510 ...

  8. mysql中利用show profile很直观的看到查询缓存的作用。

    1.首先,开启mysql的查询缓存. 查看查询缓存情况: MariaDB [test]> show variables like '%query_cache%';+--------------- ...

  9. Vue 组件&组件之间的通信 之 单向数据流

    单向数据流:父组件值的更新,会影响到子组件,反之则不行: 修改子组件的值: 局部数据:在子组件中定义新的数据,将父组件传过来的值赋值给新定义的数据,之后操作这个新数据: 如果对数据进行简单的操作,可以 ...

  10. kubernetes容器删除时快速释放ip的方案

    问题的来由 在kubernetes集群的生产中,经常遇到这样的一个问题,就是在应用大规模更新时,大量容器删除而后大量容器创建,创建的容器需要很长时间才能就绪.这其中一个可能的原因,就是大量容器删除释放 ...