首页 > 代码库 > angularJS 学习之路

angularJS 学习之路

AngularJS 通过 ng-directives 扩展了 HTML。

ng-app 指令定义一个 AngularJS 应用程序。也就是angularjs作用的入口  作用在什么标签或者整个body内部

ng-model 指令把元素值(比如输入域的值)绑定应用程序数据到 HTML 控制器(input, select, textarea)。双向绑定

ng-bind 指令把应用程序数据绑定到 HTML 视图。多用于显示内容常用span标签

ng-init 指令初始化 AngularJS 应用程序变量。定义初始值,一般不常用

ng-repeat 指令会重复一个 HTML 元素 。多用于数组的遍历

ng-controller 指令定义了应用程序控制器。使用$scope 对象来调用控制器,在控制器里为$scope添加属性和方法可以在ng-model里直接调用属性或方法,$scope必须写

 

指令

自定义指令:利用directive命令。例如:

var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
    return {
        restrict : "A",
        template : "<h1>自定义指令!</h1>"
    };
});

调用自定义命令可以把自定义命令的名字作为属性 类名(注释、标签),但是可以通过restrict来设置调用方式

  • E 作为元素名使用    不建议用
  • A 作为属性使用       
  • C 作为类名使用        建议用
  • M 作为注释使用       不建议用

 

服务

$location 获取页面的url   需要把$location作为控制器的参数

$http 向服务器发起请求获得数据   需要把$http作为控制器的参数 

var app = angular.module(‘myApp‘, []);
app.controller(‘myCtrl‘, function($scope, $http) {
    $http.get("welcome.htm").then(function (response) {
        $scope.myWelcome = response.data;
    });
});

$timeout    延迟多久执行

$interval      每隔多久执行

自定义服务:调用server命令

app.service(‘alert‘, function() {
    alert(‘server‘)
});

定义好之后调用需要在控制器的参数里加上自定义服务的名字

 

 

 

angularJS 学习之路