AngularJS入门教程之双向绑定详解

2017年02月06日 37 阅读

在这一步你会增加一个让用户控制手机列表显示顺序的特性。动态排序可以这样实现，添加一个新的模型属性，把它和迭代器集成起来，然后让数据绑定完成剩下的事情。请重置工作目录：git checkout -f step-4你应该发现除了搜索框之外，你的应用多了一个下来菜单，它可以允许控制电话排列的顺序。步骤3和步骤4之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。模板app/index.htmlSearch: <input ng-model="...

Javascript中apply、call、bind的巧妙使用

2017年02月06日 37 阅读

apply、call在 javascript 中，call 和 apply 都是为了改变某个函数运行时的上下文（context）而存在的，换句话说，就是为了改变函数体内部 this 的指向。JavaScript 的一大特点是，函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。先来一个栗子：function fruits（） {}fruits.prototype = {color: "red",say: function（） {...

JavaScript中函数声明与函数表达式的区别详解

2017年02月06日 36 阅读

前言在ECMAScript中，有两个最常用的创建函数对象的方法，即使用函数表达式或者使用函数声明。对此，ECMAScript规范明确了一点，即是，即函数声明 必须始终带有一个标识符（Identifier），也就是我们所说的函数名，而函数表达式则可以省略。下面看看这两者的详细区别介绍。什么是 Function Declaration（函数声明）？Function Declaration 可以定义命名的函数变量，而无需给变量赋值。Function Declar...

AngularJS入门教程之XHR和依赖注入详解

2017年02月06日 37 阅读

到现在为止，我们使用是硬编码的三条手机记录数据集。现在我们使用AngularJS一个内置服务$http来获取一个更大的手机记录数据集。我们将使用AngularJS的依赖注入（dependency injection （DI））功能来为PhoneListCtrl控制器提供这个AngularJS服务。请重置工作目录：git checkout -f step-5刷新浏览器，你现在应该能看到一个20部手机的列表。步骤4和步骤5之间最重要的不同在下面列出。你可以在G...

AngularJS之依赖注入模拟实现

2017年02月06日 37 阅读

一、概述AngularJS有一经典之处就是依赖注入，对于什么是依赖注入，熟悉spring的同学应该都非常了解了，但，对于前端而言，还是比较新颖的。依赖注入，简而言之，就是解除硬编码，达到解偶的目的。下面，我们看看AngularJS中常用的实现方式。方法一：推断式注入声明，假定参数名称就是依赖的名称。因此，它会在内部调用函数对象的toString（）方法，分析并提取出函数参数列表，然后通过$injector将这些参数注入进对象实例。如下：//方法一：推断式注...

AngularJS入门教程之链接与图片模板详解

2017年02月06日 35 阅读

这一步，你会为手机列表的手机添加缩略图以及一些链接，不过这些链接还不会起作用。接下来你会使用这些链接来分类显示手机的额外信息。请重置工作目录：git checkout -f step-6现在你应该能够看到列表里面手机的图片和链接了。步骤5和步骤6之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。数据注意到现在phones.json文件包含了唯一标识符和每一部手机的图像链接。这些url现在指向app/img/phones/目录。app/pho...

AngularJS入门教程之路由与多视图详解

2017年02月06日 35 阅读

在这一步，你将学习如何创建一个布局模板并且通过路由功能来构建一个具有多个视图的应用。请重置工作目录：git checkout -f step-7注意到现在当你转到app/index.html时，你会被重定向到app/index.html#/phones并且相同的手机列表在浏览器中显示了出来。当你点击一个手机链接时，一个手机详细信息列表也被显示了出来。步骤6和步骤7之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。多视图，路由和布局模板我们的...

js 获取当前web应用的上下文路径实现方法

2017年02月06日 37 阅读

js 获取当前web应用的上下文路径实现方法//js webcontextvar webroot=document.location.href;webroot=webroot.substring（webroot.indexOf（"//"）+2,webroot.length）; webroot=webroot.substring（webroot.indexOf（"/"）+1,webroot.length）;webroot=webroot.substring（...

JS获取当前使用的浏览器名字以及版本号实现方法

2017年02月06日 38 阅读

工作中需要通过JS去获取当前使用的浏览器的名字以及版本号，网上大堆资料都有一个关键词是 navigator.appName，但是这个方法获取的浏览器的名字只有两种要么是IE要么就是Netscap，倒是可以用来判断是否使用了IE，但是我想获取具体的浏览器产品名字比如 Firefox，Chrome等。所以只好通过navigator.userAgent，但是这个字符串是非常长的，分析他的特征，通过正则表达式来解决这个问题是不错的方法。（1） 获取浏览器名字+版本...

AngularJS应用开发思维之依赖注入3

2017年02月06日 42 阅读

找不到的API？AngularJS提供了一些功能的封装，但是当你试图通过全局对象angular去 访问这些功能时，却发现与以往遇到的库大不相同。$http比如，在jQuery中，我们知道它的API通过一个全局对象：$ 暴露出来，当你需要 进行ajax调用时，使用$.ajax（）就可以了。这样的API很符合思维的预期。AngularJS也暴露了一个全局对象：angular，也对ajax调用进行封装提供了一个 $http对象，但是，但是，当你试图沿用旧经验访问...

JS获取当前页面名称的简单实例

2017年02月06日 38 阅读

JS获取当前页面名称的简单实例// 取当前页面名称（不带后缀名）function pageName（）{var a = location.href;var b = a.split（"/"）;var c = b.slice（b.length-1, b.length）.toString（String）.split（"."）;return c.slice（0, 1）;} //取当前页面名称（带后缀名）function pageName（） { var strUr...

详解Angular中$cacheFactory缓存的使用

2017年02月06日 37 阅读

最近在学习使用angular,慢慢从jquery ui转型到用ng开发，发现了很多不同点，继续学习吧； 首先创建一个服务，以便在项目中的controller中引用，服务有几种存在形式，factory（）;service（）;constant（）;value（）;provider（）;其中provider是最基础的，其他服务都是基于这个写的，具体区别这里就不展开了，大家可以看看源码；服务是各个controller之间通话的重要形式，在实际项目中会用的很多，...

AngularJS入门教程之更多模板详解

2017年02月06日 35 阅读

在这一步，你将实现手机详细信息视图，这个视图会在用户点击手机列表中的一部手机时被显示出来。请重置工作目录：git checkout -f step-8现在当你点击列表中的一部手机之后，这部手机的详细信息页面就会被显示出来。为了实现手机详细信息视图我们将会使用$http来获取数据，同时我们也要增添一个phone-detail.html视图模板。步骤7和步骤8之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。数据除了phones.json，ap...

Angular中$cacheFactory的作用和用法实例详解

2017年02月06日 35 阅读

先说下缓存：一个缓存就是一个组件，它可以透明地储存数据，以便以后可以更快地服务于请求。多次重复地获取资源可能会导致数据重复，消耗时间。因此缓存适用于变化性不大的一些数据，缓存能够服务的请求越多，整体系统性能就能提升越多。$cacheFactory介绍：$cacheFactory是一个为Angular服务生产缓存对象的服务。要创建一个缓存对象，可以使用$cacheFactory通过一个ID和capacity。其中，ID是一个缓存对象的名称，capacity则...

jQuery中实现prop（）函数控制多选框（全选,反选）

2017年02月06日 34 阅读

今天看了jQuery手册，对prop（）函数又多了一点认识，记忆力不好，记录下来。prop（） : 获取匹配元素集中第一个元素的值判断checkbox中的第一个是否被选中：$（":checkbox"）.prop（"checked"）; //如果第一个checkbox被选中返回true,否则返回false.禁用和选中页面上的所有复选框：$（"input[type="checkbox"]"）.prop（"disabled", true）;$（"input[ty...

javascript设计模式Constructor（构造器）模式

2017年02月06日 35 阅读

Constructor是一种在内存已分配给该对象的情况下，用于初始化新创建对象的特殊方法。Object构造器用于创建特定类型的对象–准备好对象以备使用，同事接收构造器可以使用参数，以在第一次创建对象时，设置成员属性和方法值。对象创建 创新新对象，在javascript中通常有两种方法：1.对象直面量方法 var newObj = {};2.构造器的简洁方法 var newObj = new Object（）; 在Object构造器为特定的值创建对象封装，或...

浅谈js中test（）函数在正则中的使用

2017年02月06日 36 阅读

test（） 方法用于检测一个字符串是否匹配某个模式.返回一个 Boolean 值，它指出在被查找的字符串中是否匹配给出的正则表达式。regexp.test（str）参数regexp 必选项。包含正则表达式模式或可用标志的正则表达式对象。str 必选项。要在其上测试查找的字符串。说明 test 方法检查字符串是否与给出的正则表达式模式相匹配，如果是则返回 true，否则就返回 false。每个正则表达式都有一个 lastIndex 属性，用于记录上一次匹配...

jQuery搜索框效果实现代码（百度关键词联想）

2017年02月06日 38 阅读

可以实现关键词联想的，搜索框；集合了百度，谷歌，搜狗，360，腾讯等多家搜索search.html的代码：<！doctype html><html><head><title>搜索框例子</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script type="text/jav...

JS提示：Uncaught SyntaxError:Unexpected token ） 错误的解决方法

2017年02月06日 36 阅读

本文实例讲述了JS提示：Uncaught SyntaxError:Unexpected token ） 错误的解决方法。分享给大家供大家参考，具体如下：Uncaught SyntaxError: Unexpected token ）以下代码引发了此异常：<div class="Hd_live_Sharediv left"><a href="javascript:void（）" onclick="loadLivePlayer（"ud"）" ...

JS获取checkbox的个数简单实例

2017年02月06日 36 阅读

JS获取多选框checkbox被选中的个数。var checkbox = document.getElementsByName（"likes[]"）; //此处通过此种方式才能获得多选框为数组。//like为name = "like[]" , 获得时必须加上[]var checked_counts = 0;for（var i=0;i<checkbox.length;i++）{if（checkbox[i].checked）{ //被选中的checkbo...