zoukankan      html  css  js  c++  java
  • AngularJs 学习 (二)

    紧接着第一部分:

    推荐阅读: http://adrianmejia.com/blog/2014/10/03/mean-stack-tutorial-mongodb-expressjs-angularjs-nodejs/

    源项目: git clone https://github.com/amejiarosario/todoAPIjs.git 

    首先介绍下AngularJS是一个由模型(Model)、视图(View)、控制器(Controller)组成

      Model: 用来处理数据,包括兑取和设置数据,一般是指操作数据库。Model定义了应用层数据,它是独立于用户界面的,在AngularJS中,Model的应用非常简单,

    可以理解为一个Model就是一个对象。

      View: 在Web应用中,视图就是HTML网页,是用来展示Model数据的。在AngularJs中,数据与模板引擎相结合,在加上AngularJs的指令(Directives),从而构建了一个

    丰富的HTML页面。

      Controller: 控制器是用来操作Model中的数据的,在AngularJS应用中,控制器是通过controller()方法来创建JavaScript函数的。一个模块里面可能用多个模型和视图,控制器

    就起到了链接模型和视图的作用。

    页面跳转: 页面跳转就需要设计控制器,模板(视图),路由(Router)

      其中Router由AngularJS中的$routeProvider, 这是AngularJS中的一个服务

    $index: 这个是Angular自带的索引值,一般配合ng-repeat 使用

    $http: $http是AngularJS的内置服务,通过他可以直接与后台进行服务器通信。$http知识简单地封装了浏览器原生地XMLHttpRequest对象。

    $http服务是只能接收一个参数的函数。这个参数就是一个对象,包含了用来生成HTTP请求的配置内容;详情展示

    基于$resource的工厂方法:

      $http是一种快捷的网络请求服务,除此之外,AngularJS还提供了另外一个服务----$rescouce. $resouce对$http做了一层封装。用它来处理

    ResetfulAPI会更加快捷。

      $resource 已经封装好的方法:

      

    { 'get':    {method:'GET'},  // 读取一条记录
      'save':   {method:'POST'}, // create record
      'query':  {method:'GET', isArray:true}, // get list all records
      'remove': {method:'DELETE'}, // remove record
      'delete': {method:'DELETE'} }; // same, remove record

    上面的还缺少了一种方法就是update, 这个方法可以再$resource中进行添加

     $resource('', null , { 'update': {method: 'PUT'}

    通常这里进场会犯一个这样的错

    $resource默认接收一个object类型的返回数据。如果不添加isArray:true,而返回数据却是一个array类型,则会报错Error: [$resource:badcfg]

    解决:

    重构一下$resource

    var Videos = $resource('/videos', {}, {
          save: {method: 'POST', isArray: true}
        });

    小tips:

      跳转页面 $location.url('/')

  • 相关阅读:
    ActiveMQ 即时通讯服务 浅析
    Asp.net Mvc (Filter及其执行顺序)
    ActiveMQ基本介绍
    ActiveMQ持久化消息的三种方式
    Windows Azure Virtual Machine (27) 使用psping工具,测试Azure VM网络连通性
    Azure China (10) 使用Azure China SAS Token
    Windows Azure Affinity Groups (3) 修改虚拟网络地缘组(Affinity Group)的配置
    Windows Azure Storage (22) Azure Storage如何支持多级目录
    Windows Azure Virtual Machine (26) 使用高级存储(SSD)和DS系列VM
    Azure Redis Cache (2) 创建和使用Azure Redis Cache
  • 原文地址:https://www.cnblogs.com/yaobolove/p/8545249.html
Copyright © 2011-2022 走看看