[Cousera Angular JS学习笔记]第一周

最近在给搜索引擎做前台,开始学习Angular JS,直接上coursera上的课程:https://www.coursera.org/learn/angular-js/home/week/1(没有JS基础的同学可以和我一样先过下cousera的JS课程 Interacticity with JavaScript)

要先安装bower(方便获取JS),安装bower之前要先安装node JS

(1) 安装nodejs过程直接参考http://czpae86.iteye.com/blog/1636295,这边使用root用户安装,目录可以是/usr/local

1,先下载nodejs(使用低版本后面安装bower的时候有问题,这边用最新的):

# wget http://nodejs.org/dist/v0.12.9/node-v0.12.9.tar.gz

2,解压文件

# tar xvf node-v0.12.9.tar.gz

3,进入解压目录

# cd node-v0.12.9

4,检查所需要配置

# ./configure

出现错误提示:

Exception: Call to ‘(echo | $(echo ${CXX_host:-$(which g++)}) -m32 -E -

> /dev/null 2>&1) && echo "-m32" || true‘ returned exit status 0. while

loading dependencies of /opt/node-v0.8.7/node.gyp while trying to load

/opt/node-v0.12.9/node.gyp

5,如出现以上错误,安装gcc-c++

# yum install gcc-c++

6,进行安装(时间比较长,删除就是make uninstall):

# make install

7,检查是否成功安装,输入命令:

# node -v

如果安装成功会输出相应版本号,如:

v0.12.9

8,现在可以创建一个test.js文件进行测试,文件内容为:console.log(‘Hello World.‘);

输入命令:

# node test.js

输出:

(2)安装bower

用npm包管理工具下载并全局安装bower:
> npm install -g bower

全局安装Bower后,可以查看Bower的帮助信息,使用命令:
> bower help

(3) 然后就可以开始准备做第一个课程作业了

解压了confusion.zip,然后进入confusion目录,也就是有bower.json的那个目录,执行

bower install

报错了,说没有安装GIT,这边要装下,参考http://www.cnblogs.com/shenliang123/p/3824383.html

下载wget https://www.kernel.org/pub/software/scm/git/git-2.7.0.tar.gz

tar xvf git-2.7.0.tar.gz

cd git-2.7.0

./configure

make

这边又报错了,缺少zlib.h

1.从http://www.zlib.net/下载zlib最新版:zlib-1.2.8.tar.gz

2.解压,编译

[[email protected] gitinstall]# tar -zxvf zlib-1.2.8.tar.gz
[[email protected] gitinstall]# cd zlib-1.2.8
[[email protected] zlib-1.2.8]# ./configure
[[email protected] zlib-1.2.8]# make
[[email protected] zlib-1.2.8]# make install

再切换到上面的GIT目录安装GIT

make

make install

成功!

(4)继续做作业,进入confusion目录,也就是有bower.json的那个目录,执行

bower install

下载完之后可以看到所需要的jquery,angular js等都已经下载到browser component下面了。

然后照着cousera上的说明做,基本上问题都不大了,主要理解下angular js的directive: ng-init ng-repeat ng-app 、使用{{}}访问表达式还有two-way binding。

这边HTML/CSS还有bootstrap的基础后面还是要补的,暂时的目标是使用angular js做搜索页面(基于elasticsearch ui修改)。

				
时间: 2024-11-01 15:02:53

[Cousera Angular JS学习笔记]第一周的相关文章

[Cousera Angular JS学习笔记]第一周(2)

之前写了一个简单的angular的页面,这边主要要学习几个用法:controller,filter (1)第一个练习主要是把原来的ng-init的内容移到controller 首先定义module名称 <html lang="en" ng-app="confusionApp"> 然后初始化module和controller,是在script标签下面 <script> var app = angular.module('confusionApp

[Pro Angular.JS]学习笔记1.1:设置开发环境

可以使用yeoman.io,很方便.我已经写了一篇随笔,介绍如何使用.这里也有一篇介绍的文章:http://www.cnblogs.com/JoannaQ/p/3756281.html 代码编辑器,在Mac下用了一下WebStorm,太恶心了.另外发现书的作者使用的开发环境是Windows + VS Express 2013,为了方便学习,我也使用VS Express 2013 Update2.VS2013用起来蛮舒服的,把WebStorm比得跟驼屎一样.也许是因为我没用习惯吧. 1.安装Nod

Angular JS 学习笔记

特定领域语言 编译器:遍历DOM来查找和它相关的属性, 分为编译和链接两个阶段, 指令:当关联的HTML结构进入编译阶段时应该执行的操作,可以写在名称里,属性里,css类名里:本质上是函数 稳定的DOM:绑定了数据模型的DOM元素的实例不会在绑定的生命周期发生改变 作用域:用来检测模型的改变和为表达式提供执行上下文的 AngularJS 和其它模板系统不同,它使用的是DOM而不是字符串 指令: 由某个属性.元素名称.css类名出现而导致的行为,或者说是DOM的变化 Filter过滤器:扮演着数据

[Android游戏开发学习笔记]View和SurfaceView

本文为阅读http://blog.csdn.net/xiaominghimi/article/details/6089594的笔记. 在Android游戏中充当主要角色的,除了控制类就是显示类.而在Android中涉及到显示的是View类,及继承自它的SurfaceView类和SurfaceView的其他子类等. 这里先只说View和SurfaceView.SurfaceView的直接子类有GLSurfaceView和VideoView,可以看出GL和视频播放以及CAmera摄像头一般均使用Su

Angular JS学习笔记

之前的学习方法有点盲目,建议以后只看与工作有关的内容,并且多问那些是只和工作有关联的. 遇到问题的时候,项目不急的话,自己研究,项目急的话,马上问. 方法不对,再努力也没有用. Angular JS学习网站:http://www.zouyesheng.com/angular.html#toc7 [  项目有关的内容 ] ng-model ng-click ng-options ng-repeat ng-if ng-show ng-hide ng-controller ng-href(有印象) {

Angular.js学习笔记 (二)

用A链接对象解析url的组成 var url = 'https://www.baidu.com:8080/aaa/1.html?id=10#name'; var aLink = document.createElement('a'); aLink.href = url; console.log(aLink);//<a href="https://www.baidu.com:8080/aaa/1.html?id=10#name"></a> console.log(

Angular.js学习笔记(三)

一.过滤器 1.uppercase,lowercase 大小写转换{{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRING{{ "TANK is GOOD" | lowercase }} // 结果:tank is good2.date 格式化{{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:253.n

Angular JS 学习笔记(一)

1. 菜鸟教程:http://www.runoob.com/angularjs/angularjs-tutorial.html 2. Angular JS中文网:http://www.apjs.net/

angular.js学习笔记--概念总结

好久没更新了,现在开始学习学习angularjs,并且把学习到的一些知识总结记录一下,方便以后查找以及希望能给初学者一些帮助!(由于本人也是初学ng所以各位慎重理解!) 废话不多说,开始! $rootScope 和 $scope: $rootScope是angular中最接近全局作用域的对象,是所有$scope对象的最上层! $scope对象就是一个普通的js对象,我们可以在其上随意修改和添加属性,并且其在angular中充当数据模型,它是所有属性都可以自动呗视图访问到,但是它并不负责数据的处理