初探angular

前言

　　angular4.0目前已经发布了，angular是mvw框架，所以对其有一个简单的了解还是很有必要的。目前angular有中文官网，且文档介绍也都是4.x的，但是为了了解其发展过程，我们先了解anguar1.x版本的，然后再了解4.x版本。

　　angular的特点：

跨平台开发。angular可以在网页、移动app、hybrid等多平台使用，angular所倡导的也是一套框架、多种平台。
速度与性能。angular本身还是十分先进的，比如其使用的是web worker和服务器端渲染，这样可以最大限度的增加响应速度。
美妙的工具。angular可以使用简洁的声明式模板进行快速开发。并且大多数的IDE都可以支持angular的各种特性并提供了通用的组件。
流行。 angular目前在github上的star数已经超过了两万（1.x版本的angular已经超过了5万）。

第一部分： angular1.x版本

　　angular 1.x 文档

　　angular1.0版本是在2012年谷歌开源发布的，至今也不过5年的时间，github上的star数已经超过5万，可见其受欢迎程度。

　　首先，我们先来看一个最简单的angular实例：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

</head>

<body>

<div ng-app="">

  <p>名字 : <input type="text" ng-model="name"></p>

  <h1>Hello {{name}}</h1>

</div>

</body>

</html>

实例讲解：
　　当网页加载完毕，AngularJS 自动开启。
　　ng-app 指令告诉 AngularJS，<div> 元素是 AngularJS 应用程序的"所有者"。
　　ng-model 指令把输入域的值绑定到应用程序变量 name，其中可以看到angular也是通过 {{}} 来使用angular表达式的。　　

　　并且不难得知一个angular应用是由模块(Module)来定义的，而其又是由 controller 来控制的，后续会主要来讲解。

　　即我们首先引入了 angular.min.js ，这个js文件大约有160多kb，还是可以接受的, 但是相较于vue的70多kb，可以发现angular是vue的将近两倍大小，所以我们也就常说vue是一个轻型的JavaScript框架。然后使用angular指令 ng-app 指定了div为angular容器。接着使用了ng-model作为了双向数据绑定的指令，这样，当我们在input中输入时，就会在下面的H1中得到同步的相应，以此来实现数据的双向绑定（之前提到angular的框架是mvw，即既可以扩展为mvc又可以扩展为mvvm等等）。另外，可以看到这方面angular和vue的理念都是类似的。

1、 Angular表达式

　　即将表达式写在{{}}中，同样也可以使用ng-bind实现相同的功能。其中可以是数字、对象、数组等。

补充：angular初始化。在angular中，也是可以进行初始化的，使用ng-init即可，这种方法在真正的项目中不常用，但是作为演示，还是有学习的必要的，如下所示：
<div ng-app="" ng-init="quantity=1;cost=5">

<p>总价: {{ quantity * cost }}</p>

</div>
这样，我们就通过ng-init将quantity赋值为1，将cost赋值为5了。

2、 Angular指令

　　angular指令是扩展的html属性，都带有ng-前缀，如之前遇到的ng-init、ng-bind等等。又如可以通过ng-model进行数据绑定。

　　ng-repeat也可以对数组、对象等遍历，这和vue中的v-for的作用是类似的。

　　除此之外，angular为了提供更好地可扩展性，还可以通过自定义指令来对应用进行更好地控制。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

</head>

<body ng-app="myApp">

<runoob-directive></runoob-directive>

<script>

var app = angular.module("myApp", []);

app.directive("runoobDirective", function() {

    return {

        template : "<h1>自定义指令!</h1>"

    };

});

</script>

</body>

</html>

如上所示：通过 app.directive() 方法就可以定义自定义的指令了，然后在html中渲染即可。

　　在angular中，我们可以通过以下方式来调用指令：

元素名。即上面直接使用<runoob-directive></runoob-directive>来调用。
属性。定义属性之后可以直接通过 <div runoob-directive></div> 这种方式来调用。
类名。使用<div class="runoob-directive"></div>来调用。但是在定义的时候有所不用，需要指明C，下面通过一个例子来说明。
注释。 直接调用，同样，需要指明M。

　　即这些指令，需要限制使用。 通过添加 restrict 属性,并设置只值为 "A", 来设置指令只能通过属性的方式来调用:

var app = angular.module("myApp", []);

app.directive("runoobDirective", function() {

    return {

        restrict : "A",

        template : "<h1>自定义指令!</h1>"

    };

});

　　另外，我们还需要知道的是： restrict的值还可以是下面几种：

E --- element 作为元素名使用
A --- attribute 作为属性使用
C --- class作为类名使用
M 作为注释使用

3、 angular模型

　　所谓模型，实际上就是指ng-model，因为ng-model中的输入域的值可以和angular创建的变量相绑定，如下所示:

<div ng-app="myApp" ng-controller="myCtrl">

    名字: <input ng-model="name">

</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

    $scope.name = "John Doe";

});

</script>

　　即首先通过module创建一个app，然后加入控制器来控制myCtrl中的内容，controller()的第二个参数接受一个函数，其参数必须为$scope，可以对myCtrl中的值进行控制。

　　当然，我们也可以使用ng-model实现文章开头举例的数据双向绑定。

　　angular中还可以对用户输入进行验证，这是vue本身所缺少的，如下所示:

<form ng-app="" name="myForm">

    Email:

    <input type="email" name="myAddress" ng-model="text">

    <span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span>

</form>

　　这里的ng-show和vue中的v-show用法类似，但是这里我们可以通过通过myForm.myAddress.$error来调用错误，如果这里有错误，那么span就会显示提示错误，如果没有错误，那么就不会显示。并且其验证的时机就是在失去焦点时开始验证。

　　我们还可以根据v-model来获取到表单的状态，包括invalid, dirty, touched, error。

4、angular作用域

　　使用angular控制器时，我们可以使用作用域$scope了。当在控制器中添加了$scope时，就可以通过视图来获取到作用域中的值了，即获取$scope对象。

　　另外，所有的应用都有一个根作用域，即$rootScope，在根作用域中定义的值可以在各个控制器中使用。

5、angular控制器

　　我们通过ng-controller来定义控制器，并且可以通过控制器来控制其中的所有数据。

　　之前我们举例控制器的时候提到的都是控制属性，实际上还可以通过控制器来实现方法，如下所示：

<div ng-app="myApp" ng-controller="personCtrl">

名: <input type="text" ng-model="firstName"><br>

姓: <input type="text" ng-model="lastName"><br>

<br>

姓名: {{fullName()}}

</div>

<script>

var app = angular.module('myApp', []);

app.controller('personCtrl', function($scope) {

    $scope.firstName = "John";

    $scope.lastName = "Doe";

    $scope.fullName = function() {

        return $scope.firstName + " " + $scope.lastName;

    }

});

</script>

这样，就可以在html的表达式中调用方法了。

在大型文件中，控制器中的代码是比较繁琐的，所以我们往往将之写在一个外部js文件中，然后直接引用即可。

6、angular过滤器

　　同vue类似，angular也是支持过滤器的，这样，更加方便我们的操作。使用过滤器很简单，只需要在表达式中添加一个 | 管道字符，然后添加一个过滤器即可。

<div ng-app="myApp" ng-controller="personCtrl">

<p>姓名为 {{ lastName | uppercase }}</p>

</div>

　　如上所示，这个内置的过滤器就会将lastName的内容（可以通过控制器来控制）转化为大写。其他过滤器如下:

curreny --- 转化数字为货币形式。
lowercase --- 与uppercase相反，将字母转化为小写形式。
orderBy: '字符串' --- 可以在ng-repeat中将某个对象、数组进行排序显示。
filter --- 过滤输入，举例如下：

<div ng-app="myApp" ng-controller="namesCtrl">

<p><input type="text" ng-model="test"></p>

<ul>

  <li ng-repeat="x in names | filter:test | orderBy:'country'">

    {{ (x.name | uppercase) + ', ' + x.country }}

  </li>

</ul>

</div>

　　当然，很多情况下，可能这些过滤还是不够用的，我们可以自定义过滤器，如下：

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

    $scope.msg = "Runoob";

});

app.filter('reverse', function() { //可以注入依赖

    return function(text) {

        return text.split("").reverse().join("");

    }

});

　　即通过filter方法来自定义过滤器。

7、 angularjs服务

　　在angular中可以使用内置服务，也可以自建服务。在angular中服务可以是一个函数或者是一个对象，且共有30多个内置的服务，比如$location服务、$http服务等等。

　　使用angular中的服务比直接使用window中的对象更好一些，比如使用$location服务比使用window.location更具灵活性。

　　如上所示，通过对比可以发现使用内置服务是非常不错的。

$http服务也是angular中常用的服务，通过$http大大简化了我们发送ajax请求的步骤，并且还可以很好的和angular相融合。如下所示，就是使用angular的$http服务发送请求：

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope, $http) {

    $http.get("welcome.htm").then(function (response) {

        $scope.myWelcome = response.data;

    });

});

可以看到使用$http服务好处如下：

简化了操作，如果只使用原生ajax是非常麻烦的，所以angular提供了$http服务。
另外，像vue，我们如果希望使用简洁的http服务，不得不使用resource或者使用axios，但是使用这些都必须再引入额外的文件，而angular已经提前继承了，所以使用起来时非常方便的。但是，不可避免的使得angular的体型是vue的足足两倍之多。
针对第二点，其实还好，因为在写中大型应用的时候，http是一定需要的，使用angular就不需要这么多的问题了。
而随之而来的问题是，使用vue然后外加axios或者resource的好处是方便我们选择不同的http请求框架。

$timeout服务。此服务对原生的timeout包装了一层函数，实现了promise，在stackoverflow上对此有很好的解释：

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope, $timeout) {

    $scope.myHeader = "Hello World!";

    $timeout(function () {

        $scope.myHeader = "How are you today?";

    }, );

});

而$interval服务与此类似，不做过多解释。

另外，同指令一样，我们还可以创建自定义的服务，如下：

app.service('hexafy', function() {

    this.myFunc = function (x) {

        return x.toString();

    }

});

8、angular HTTP

　　之前提到angular中内置了很多服务，而其中的http服务便是其中非常重要的一个。最基本的格式如下：

// 简单的 GET 请求，可以改为 POST

$http({

    method: 'GET',

    url: '/someUrl'

}).then(function successCallback(response) {

        // 请求成功执行代码

    }, function errorCallback(response) {

        // 请求失败执行代码

});

　　但是，一般对于get请求和post请求都会使用相对简洁的形式，如下所示：

$http.get('/someUrl', config).then(successCallback, errorCallback);

$http.post('/someUrl', data, config).then(successCallback, errorCallback);

9、angular select（选择框）

　　angular可以通过数组或者对象创建一个下拉框。　　

<div ng-app="myApp" ng-controller="myCtrl">

<select ng-init="selectedName = names[0]" ng-model="selectedName" ng-options="x for x in names">

</select>

</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

    $scope.names = ["Google", "Runoob", "Taobao"];

});

</script>

　　即这里使用了ng-options指令。

10、angular 表格

　我们可以使用ng-repeat很容易的实现表格，结合使用orderBy过滤器效果更佳。与vue不同的时，使用Index需要 v-for='item,index in items '这种形式，而angular可以不声明 index 而直接使用$index来引用，但是缺点在于无法解决嵌套的问题，因为当有多个 ng-repeat 时，直接使用$index就会导致数据的混乱。

　另外，为了方便表格的使用，angular还提供了了 $odd 和 $even来判断表格中的奇数行和偶数行。

11、angular html dom

　　在angular中我们还可以通过ng-disabled绑定到html中diaabled的属性。同vue类似，也可以使用ng-show、ng-if，只是在angular中多了一个ng-hide，但本质是类似的。

12、 angular事件

　　angularjs同样拥有自己的html事件，如使用ng-click来表示点击事件，其他类似。更多的我们可以在angularjs的API列表中看到。

13、 angular 模块

　　在angular中模块定义了一个容器，我们通过angular.module()来创建模块，并且可以在模块上添加控制器，也可以在模块上添加自定义的过滤器和指令。

　　即自定义的过滤器、指令都是添加到模块上的。

14、表单

　　和vue类似，在angular中也是可以使用v-model来绑定单选框、复选框、下拉菜单等。

15、 angular.js API

　　AngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合，如：

比较对象
迭代对象
转换对象

　　如下是常见的api：

　举例如下；

<div ng-app="myApp" ng-controller="myCtrl">

<p>{{ x1 }}</p>

<p>{{ x2 }}</p>

</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

$scope.x1 = "JOHN";

$scope.x2 = angular.lowercase($scope.x1);

});

</script>

16、 angular bootstrap

　　angular和bootstrap框架是可以共同使用的，以此来提高开发效率。

　　如下，我们只要事先引入bootstrap和angular即可。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<link rel="stylesheet" href="//apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.min.css">

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

</head>

<body ng-app="myApp" ng-controller="userCtrl">

<div class="container">

<h3>Users</h3>

<table class="table table-striped">

  <thead>

    <tr>

      <th>编辑</th>

      <th>名</th>

      <th>姓</th>

    </tr>

  </thead>

  <tbody>

    <tr ng-repeat="user in users">

      <td>

        <button class="btn" ng-click="editUser(user.id)">

          <span class="glyphicon glyphicon-pencil"></span>编辑

        </button>

      </td>

      <td>{{ user.fName }}</td>

      <td>{{ user.lName }}</td>

    </tr>

  </tbody>

</table>

<hr>

<button class="btn btn-success" ng-click="editUser('new')">

<span class="glyphicon glyphicon-user"></span>创建新用户

</button>

<hr>

<h3 ng-show="edit">创建新用户:</h3>

<h3 ng-hide="edit">编辑用户:</h3>

<form class="form-horizontal">

  <div class="form-group">

    <label class="col-sm-2 control-label">名:</label>

    <div class="col-sm-10">

    <input type="text" ng-model="fName" ng-disabled="!edit" placeholder="名">

    </div>

  </div>

  <div class="form-group">

    <label class="col-sm-2 control-label">姓:</label>

    <div class="col-sm-10">

    <input type="text" ng-model="lName" ng-disabled="!edit" placeholder="姓">

    </div>

  </div>

  <div class="form-group">

    <label class="col-sm-2 control-label">密码:</label>

    <div class="col-sm-10">

    <input type="password" ng-model="passw1" placeholder="密码">

    </div>

  </div>

  <div class="form-group">

    <label class="col-sm-2 control-label">重复密码:</label>

    <div class="col-sm-10">

    <input type="password" ng-model="passw2" placeholder="重复密码">

    </div>

  </div>

</form>

<hr>

<button class="btn btn-success" ng-disabled="error || incomplete">

<span class="glyphicon glyphicon-save"></span>修改

</button>

</div>

<script src="myUsers.js"></script>

</body>

</html>

17、 angular 包含

　　使用angular我们可以使用ng-include在html中包含html。　　

<!DOCTYPE html>

<html>

<meta charset="utf-8">

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

<body ng-app="">

<div ng-include="'runoob.htm'"></div>

</body>

</html>

18、 angular动画

　　angular提供了动画效果，配合css使用，但是在使用angular动画之前，需要引入 angular-animate.min.js 。并且还要在模型中使用ngAnimate

　　如下所示：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

div {

  transition: all linear .5s;

  background-color: lightblue;

  height: 100px;

  width: %;

  position: relative;

  top: ;

  left: ;

}

.ng-hide {

  height: ;

  width: ;

  background-color: transparent;

  top:-200px;

  left: 200px;

}

</style>

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular-animate.min.js"></script>

</head>

<body ng-app="ngAnimate">

<h1>隐藏 DIV: <input type="checkbox" ng-model="myCheck"></h1>

<div ng-hide="myCheck"></div>

</body>

</html>

　　先引入了angular.min.js又引入了angular-animate.min.js，然后在body中定义了ng-app='ngAnimate'，这样就可以使用动画了，我们希望这个div隐藏，所以使用ng-hide，并配合.ng-hide的css来小时。

　　值得注意的是我们在div中添加了transition: all linear 0.5s;。

19、 angular.js 依赖注入

什么是依赖注入？

wiki 上的解释是：依赖注入（Dependency Injection，简称DI）是一种软件设计模式，在这种模式下，一个或更多的依赖（或服务）被注入（或者通过引用传递）到一个独立的对象（或客户端）中，然后成为了该客户端状态的一部分。该模式分离了客户端依赖本身行为的创建，这使得程序设计变得松耦合，并遵循了依赖反转和单一职责原则。与服务定位器模式形成直接对比的是，它允许客户端了解客户端如何使用该系统找到依赖。

angularjs提供了很好的机制实现依赖注入，如下所示：

value
factory
service
provider
constant

value

　　value是一个简单的JavaScript对象，用于向模块中传递值，然后注入到控制器中。

// 定义一个模块

var mainApp = angular.module("mainApp", []);

// 创建 value 对象 "defaultInput" 并传递数据

mainApp.value("defaultInput", );

...

// 将 "defaultInput" 注入到控制器

mainApp.controller('CalcController', function($scope, CalcService, defaultInput) {

   $scope.number = defaultInput;

   $scope.result = CalcService.square($scope.number);

   $scope.square = function() {

      $scope.result = CalcService.square($scope.number);

   }

});

　　即我们首先定义了一个模块，然后创建了对象defalutInput传递到模块中，紧接着我们又将模块注入到控制器，并且传入了defaultInput, 于是，我们就可以在控制器中使用传入的值了。

factory、service

　　factory是一个函数，最后返回一个对象，对象中包含方法，然后在service中被调用。举例如下：

// 定义一个模块

var mainApp = angular.module("mainApp", []);

// 创建 factory "MathService" 用于两数的乘积 provides a method multiply to return multiplication of two numbers

mainApp.factory('MathService', function() {

   var factory = {};

   factory.multiply = function(a, b) {

      return a * b

   }

   return factory;

}); 

// 在 service 中注入 factory "MathService"

mainApp.service('CalcService', function(MathService){

   this.square = function(a) {

      return MathService.multiply(a,a);

   }

});

...

　　即定义了factory之后，我们就可以在service中使用了，而这里的service如果没有猜错就像之前的指令、过滤器一样是自定义的，我们可以通过 angular.$CalcService()来调用这个方法。

Provider　　

　　AngularJS 中通过 provider 创建一个 service、factory等(配置阶段)。

　　Provider 中提供了一个 factory 方法 get()，它用于返回 value/service/factory。

// 定义一个模块

var mainApp = angular.module("mainApp", []);

...

// 使用 provider 创建 service 定义一个方法用于计算两数乘积

mainApp.config(function($provide) {

   $provide.provider('MathService', function() {

      this.$get = function() {

         var factory = {};  

         factory.multiply = function(a, b) {

            return a * b;

         }

         return factory;

      };

   });

});

constant　　

　　constant是在配置阶段传递数值的。在配置阶段不可使用。

20、 angular路由

　　同vue使用vue-router一样，使用angular路由需要引入angular-route.min.js文件。

<html>

    <head>

        <meta charset="utf-8">

        <title>AngularJS 路由实例 - 菜鸟教程</title>

    </head>

    <body ng-app='routingDemoApp'>

        <h2>AngularJS 路由应用</h2>

        <ul>

            <li><a href="#/">首页</a></li>

            <li><a href="#/computers">电脑</a></li>

            <li><a href="#/printers">打印机</a></li>

            <li><a href="#/blabla">其他</a></li>

        </ul>

        <div ng-view></div>

        <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

        <script src="http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js"></script>

        <script>

            angular.module('routingDemoApp',['ngRoute'])

            .config(['$routeProvider', function($routeProvider){

                $routeProvider

                .when('/',{template:'这是首页页面'})

                .when('/computers',{template:'这是电脑分类页面'})

                .when('/printers',{template:'这是打印机页面'})

                .otherwise({redirectTo:'/'});

            }]);

        </script>

    </body>

</html>

基本的路由配置如上，可以看到，这里使用了routerProvider，然后使用when()方法来做出判断，导向不同的路由。即在angular中也是使用#/路由路径的方式来进行路由的。另外，在vue中使用router-view来接收路由过来的内容，而在angular中我们使用的是<div ng-view></div>的方式来接收路由来的内容，基本原理还是类似的。

更多我们可以参考这里。　　

初探angular的更多相关文章

angular.js初探
2015年7月27日 22:26:35 星期一用在我论坛里的小栗子: 先列出来一级回帖, 点击帖子前边的"查看回复"按钮无刷新的去请求该帖子的所有回复首先要引用js文件, 我这 ...
AngularJS2之Angular正式初探
前言:angular的官方教程真的不错.强烈推荐!!!] 按照环境搭建教程新建一个项目: 项目的结构如下: 其中package.json指示node需要安装的插件(npm install指令会安装的插 ...
MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
Unity3D游戏开发初探—3.初步了解U3D物理引擎
一.什么是物理引擎? 四个世纪前,物理学家牛顿发现了万有引力,并延伸出三大牛顿定理,为之后的物理学界的发展奠定了强大的理论基础.牛顿有句话是这么说的:“如果说我看得比较远的话,那是因为我站在巨人的肩膀 ...
angular指令浅谈
今天在闲暇时间再次对angularjs的指令进行了初探,不探不知道一探吓一跳啊, 就一个简单的指令整整难住我了两个小时,先不说代码的逻辑是否复杂,就一些内部的一些实现让我看起来都是头疼的不行啊,不过最 ...
从壹开始前后端分离 [ vue + .netcore 补充教程 ] 二七║ Nuxt 基础：框架初探
缘起哈喽大家好,又是周四了,俗话说周四来了,周末还远么哈哈,老张我也想下周请假,来个16天的大长假哟,不知道大家是怎么请假的,近来发现文章下边已经没有人评论了,赶脚比较凄凉了,大家看到的麻烦点个赞呀 ...
TypeScript初探
TypeScript初探 TypeScript什么? 官方给的定义:TypeScript是一种由微软开发的自由和开源的编程语言,它是JavaScript类型的超集,可以编译成纯JavaScript,本 ...
前端框架 Vue 初探
一.前言前几日使用微信网页版时,好奇这个网页用了什么前端框架.用Chrome的开发人员模式一探到底,发现原来用了一个名叫 Angular 的框架.好吧,既然微信用了.那我也最好还是看看.等等,你这篇 ...
沉淀，再出发：AngularJS初探
沉淀,再出发:AngularJS初探一.前言知识的学习需要形成一个闭环,在这个闭环之内可以自圆其说,从而触类旁通,加以理想创造,从而产生灵感.关于前端的知识,我已经写得差不多了,但是还有一个知识点 ...

随机推荐

Android Service基本知识总结（一）
一.简介 Service是Android系统的后台服务组件,适用于开发无界面.长时间运行的应用功能Service特点如下: 没有用户界面不会轻易被Android系统终止在系统资源恢复后Servic ...
HTML5移动Web开发实战 PDF扫描版
<HTML5移动Web开发实战>提供了应对这一挑战的解决方案.通过阅读本书,你将了解如何有效地利用最新的HTML5的那些针对移动网站的功能,横跨多个移动平台.全书共分10章,从移动Web. ...
Snapshot--使用脚本创建快照
USE master; SET NOCOUNT ON; GO ); --数据库名 );--快照名 );--保存路径 SET @dbname='DB1'; SET @snapname='DB1_SNAP ...
DataSet取值并保存在List集合中
DBHelper db = new DBHelper(); //实例化DB类 string sql = "select * from student"; //虚构的sql语句 Da ...
go的同步模型
首先来看一段代码,这是The Go Memory Model一文中的一个例子 var a, b int func f() { a = 1 b = 2 } func g() { ...
【转】如何把CD上的音乐拷贝到电脑上
参考:https://www.ixueshu.com/document/9c44893da6e90cf7318947a18e7f9386.html 参考:https://jingyan.baidu.c ...
不值一提，却又不得不提的“CSS文本超出部分省略号代替”
偶然看到一篇类似css技巧与经验总结的文章,其中有一部分非常熟悉,那就是“css控制元素内文本超出部分使用省略号代替”,一般实际工作中, 很多产品经理会对页面UI有这样的要求.还记得,第一次做这个功能 ...
Python编程笔记二进制、字符编码、数据类型
Python编程笔记二进制.字符编码.数据类型一.二进制 bin() 在python中可以用bin()内置函数获取一个十进制的数的二进制计算机容量单位 8bit = 1 bytes 字节,最小的存 ...
c3中基本动画
动画:是CSS3中具有颠覆性的特征之一,可通过设置多个节点来精确控制一个或一组动画,常用来实现复杂的动画效果:. 必要元素: a.通过@keyframes指定动画序列:自动补间动画,确定两个点,系统会 ...
对于Discuz 及PHP的一点个人感受
首先我知道PHP是一种编程语言,PHP这玩意灵活性够了,但总是让人感觉写出来的代码让人如坠五里雾中,一会一个变量,$什么,一会又一个$.对于它是什么类型我有时候结合上下文件,还能找得到,但是有的时候最 ...

初探angular

前言

第一部分： angular1.x版本

factory、service

Provider

constant

初探angular的更多相关文章

随机推荐

热门专题

Provider　　

constant　　