在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. mysql杯观锁与乐观锁

    悲观锁与乐观锁是两种常见的资源并发锁设计思路,也是并发编程中一个非常基础的概念.本文将对这两种常见的锁机制在数据库数据上的实现进行比较系统的介绍. 悲观锁(Pessimistic Lock) 悲观锁的 ...

  2. Ajax不执行回调函数的原因(转)

    今天用ajax的post请求后台,但是始终不执行回调函数,经查得知,ajax不执行回调函数的原因如下: jquery中规定返回的JSON字符串的KEY要用引号括起来,如{“result”: 1}这样才 ...

  3. python 七段管模块

    python 七段管模块 def drawGap(): #绘制数码管间隔 turtle.penup() turtle.fd(5) def drawLine(draw): #绘制单段数码管 drawGa ...

  4. Angular4中使用后台去数据,Swiper不能滑动的解决方法(一)

      Swiper是目前较为流行的移动端触摸滑动插件,因为其简单好用易上手,很受很多设计师的欢迎. 今天在使用Swiper的时候遇到这个问题: 使用angularjs动态循环生成swiper-slide ...

  5. HTML5培训入门基础知识了解CSS3 3D属性

    CSS3 3D 什么是3d的场景呢? 2d场景,在屏幕上水平和垂直的交叉线x轴和y轴 3d场景,在垂直于屏幕的方法,相对于3d多出个z轴 Z轴:靠近屏幕的方向是正向,远离屏幕的方向是反向 CSS3中的 ...

  6. Easy methods to select MB Star, Extremely MB Star, MB SD C4, Mercedes BENZ C5 SD

    MB Star, Extremely MB SD Connect C4, MB SD C4, Mercedes BENZ C5 SD are usually analysis tools to get ...

  7. 创建我的vue项目

    vue-cli 全局安装 1.命令行执行:npm install --global vue-cli: ------也可以用这个命令下载新版本 2.安装完成以后 可以输入命令 :vue 回车,可以看到针 ...

  8. word模板导出的几种方式:第三种:标签替换(DocX组件读取与写入Word)

    dll文件下载地址:https://files-cdn.cnblogs.com/files/daizhipeng/DocX.rar DocX wordDocumentOld = DocX.Load(S ...

  9. linux coredump开启

    1. ulimit -c unlimited  //不限制core文件的大小 2. echo '/tmp/core.%e.%p.%t'  > /proc/sys/kernel/core_patt ...

  10. Linux 下 LXD 容器搭建 Hadoop 集群

    配置要求 主机内存 4GB . 磁盘 100 GB 以上. HOST 机安装常用 Linux 发行版. Linux Container ( LXD ) 以主机 ubuntu 16.04 为例. 安装 ...