随笔分类 - 技术
摘要:在这一步中,我们将会通过在我们先前创建的模板代码中添加CSS和JavaScript动画效果来扩展我们的web应用。 ·我们现在使用ngAnimate模块来允许动画效果贯穿整个应用。 ·我们也依赖于自带的指令来自动触发动画来进行开发。 ·当一个动画效果被发现时,在给定的时间内,它将会和置于元素中的实际
阅读全文
摘要:在这一步中,我们将会改变我们获取数据的方式。 ·我们定义一个代表RESTful客户端的自定义服务。使用这个客户端,我们可以用一种更简单的方法向服务端请求数据,而不用处理更底层的$httpAPI,HTTP方法和URLs。 最重要的变化列举如下,您可以点击这里在GitHub上查看全部的不同。 依赖 RE
阅读全文
摘要:在这一步中,您将会在电话细节页面添加一个可点击的电话图片转换器。 ·电话细节页面展示了当前电话的一张大图片和几张相对较小的略图。如果我们能仅仅通过点击略图就能把大图片换成略图就好了。让我们看看用Angular如何实现它。 最大的不同列举如下,您可以点击这里在GitHub上查看全部的不同。 组件控制器
阅读全文
摘要:在这一步中您将学到如何创建您自己的展示过滤器。 ·在先前的步骤中,细节页面展示“true”或“false”来显示某部电话是否有某项功能。在这一步中,我们将使用自定义的过滤器来将这些个字符串转化成符号:✓ 代表“true”, ✘代表“false”。 让我们看看过滤器代码看起来是什么样的。 最重要的改变
阅读全文
摘要:在这一步中,我们会实现电话细节的视图,这在用户点击列表中的一部电话时被展示。 ·当您点击列表中的一部电话时,带有电话特定信息的电话细节页面将被展示。 我们打算使用$http来获取我们的数据,以此来实现电话细节视图,然后刷新phoneDetail组件模板。 最大的不同列举如下,您也可以点击这里从Git
阅读全文
摘要:在这一步中,您将学到如何创建一个布局模板,并且学习怎样使用一个叫做ngRoute的Angular模块来构建一个具有多重视图的应用。 ·当您现在访问/index.html,您将被重定向到/index.html#!/phones,电话列表会显示在浏览器中; ·当您点击一部电话的超链接,URL会改变至该指
阅读全文
摘要:在这一步中,我们将会在电话列表中为电话添加略图,并附上链接,当然现在也不会链接去哪。在随后的步骤中,我们将使用这些链接来展示电话列表中额外的信息。 ·现在电话列表中会有链接和图片。 最重要的不同在下面列出。您可以点击这里在GitHub上查看全部的不同。 数据 注意到phones.json文件中包含了
阅读全文
摘要:在这一步中,我们将不会在我们的应用中添加任何新功能,相反,我们打算退回一步,重构我们的代码库,移动我们的代码和文件,以此来使我们的应用更具易扩展性和可维护性。 在先前的步骤中,我们已经见识到了如何将我们的应用构建得更具模块性和可测试性。另一种同样重要的思想是,用一种使得查看代码变得容易(无论对我们还
阅读全文
摘要:在先前的步骤中,我们看到了一个控制器和一个模板如何一起工作来将一个静态的HTML文件转化为动态页面(view)。一般说来,这在单页应用中一种非常常见的模式(在Angular应用中尤其是这样): ·客户端代码“掌管”并和视图层实现了动态交互,通过在数据模型和状态中即刻更新视图来反应改变,这经常是用户交
阅读全文
摘要:我们受够了在应用中用硬编码的方法嵌入三部电话!现在让我们用Angular内建的叫做$http的服务来从我们的服务器获取更大的数据集吧。我们将会使用Angular的依赖注入来为PhoneListCtrl控制器提供服务。 ·现在我们有一个20部电话的列表,它们都是从服务器加载而来。 最重要的变化列举如下
阅读全文
摘要:在这一步中,您将会添加一个新特性来使得您的用户可以控制电话列表中电话的顺序,动态改变顺序是由创建一个新的数据模型的特性实现的,将它和迭代器绑定在一起,并且让数据绑定神奇地处理下面的工作。 ·除了搜索框,应用会展示一个下来菜单来允许用户控制电话列表的顺序。 最大的改变列举如下,当然您可以点击这里查看全
阅读全文
摘要:在上一步中,我们花了很大功夫来布局应用的基础,所以我们现在做点简单点的吧!我们将会添加一个全文本搜索框(没错,这很简单)。 ·我们的应用现在会有一个搜索框,注意页面中手机列表的改变取决于用户在搜索框键入的内容。 最重要的变化列举如下,当然,你也可以点击这里在GitHub上查看全部的不同。 控制器 我
阅读全文
摘要:是时候用AngularJS生成我们的动态页面了。 通常我们有很多方法来构建一个应用的代码。对于Angular的应用,我们鼓励使用MVC设计模式来解耦代码并且实现职责独立。记住这个,现在让我们在我们的应用中使用一点Angular和Javascript来添加模型,视图和控制器成分。 ·列表中的三部电话是
阅读全文
摘要:为了说明Angular如何扩展了标准的html,您将会创建了一个纯粹的静态html页面,并且看到我们如何将这些html代码转换成Angular能动态展示相同结果的模板。 在这一步您将会在一个html页面中添加两部手机的基本信息。 ·这个页面现在包含一个有两部手机的基本信息名单。 最重要的不同被列在了
阅读全文
摘要:在这一节的tutorial中,您将会逐渐熟悉AngularJS phonecat app的最重要的源代码文件。您也将学到如何将开发服务器与angular-seed绑定到一起,并且在浏览器中运行应用。 在您继续之前,请确保您已经搭建好您的开发环境并且安装了所有必要的依赖,像这里描述的那样。 在angu
阅读全文
摘要:(注:曾经在《不敢止步》一书中看到学到一个观点,作者认为学习一门技术最好的方法就是翻译某部领域书籍。这里我决定做一次尝试,接下来花1个月左右时间,将Angular Tutorial Phonecat范例全部翻译一遍,这当然更多是希望自己能得到一个提高。翻译力求尽善尽美,当然质量实在难以保证。所有专有
阅读全文
摘要:我时常以为,所谓的“设计模式”,更多像是一种方法论,而不应该算作所谓的“知识点”。这些就像高中数学有专门的解题方法集合,形如“不等式逼等式”(证明一个未知数大于等于一个值,同时又证明这个未知数小于等于这个值,那么这个未知数只能是这个值)这样的方法一般,根本没法说得非常具体。而这才是所谓“知识”大放异
阅读全文
摘要:最近在看Head First的Design Pattern,想想去年候捷来学校给我们讲Design Pattern,但当时水平太弱根本听不懂,今年想趁机再好好学一波,候捷反而不来了,哎,人生就是这样,有些机会真的搞不好只有一次了,所以还是要多多珍惜,不然... ... (再水下去估计没人看了,废话少
阅读全文
浙公网安备 33010602011771号