码迷,mamicode.com
首页 > 其他好文 > 详细

致以后可能会用到的angular(虽然没什么机会)

时间:2014-11-16 17:11:09      阅读:123      评论:0      收藏:0      [点我收藏+]

标签:style   http   io   color   ar   os   使用   sp   数据   

angular是一种框架,它在一定程度上补足了HTML在构建应用方面的缺陷,它使用称为标识符的结构,让浏览器能够识别。比如:使用两个大括号进行数据绑定;在angular认为,一切DOM操作都是不合理的,所以在使用angular的时候,根本就不用进行DOM操作,它提供了简单适用的方法来替代传统的DOM操作,具体后面会提到;angular还有自己独特的匹配指令,指示器,和ajax语句。

首先,要使用angular必须先给一个作用域,比如:<body ng-app></body>。这句话的意思就是将作用域的范围规定在body里面,我们可以在body里面使用任何angular的操作。

然后,在进行angular操作的时候,我们要先确定一个操作器比如:<div ng-controller></div>这样就定义了一个操作器,我们可以在其中使用‘ng-click="fun()"‘绑定事件,在传统的js中,如果我们想要动态的实现表单的增删改查,很多时候需要进行字符串的拼接,然后用"innerHTML"来实现,但是在angular中我只需要很简单的一句话就OK了,"<ul><li ng-repeat=‘i in info‘>{{i}}</li></ul>"来进行实现,同时在JS中的写法为

"   

function show($scope) {
        $scope.info =[‘1‘,‘2‘,‘3‘,‘4‘];
        $scope.msg = function () {
            $scope.info.push(‘xts‘);
        }
        $scope.del = function () {
            $scope.info.pop();
        }
        $scope.cha = function () {
            $scope.info[0] = ‘xxm‘;
        }
    }

"

其中"show"是控制器的名称,而"info"则是对应了"ng-repeat"里面"info"的,比较重要的是"$scope"这个参数,不能够随便修改,我们就通过它来实现数据的链接,将后台的数据传送到页面。

angular中还为我们提供了很好的匹配指令,能够通过属性名,元素名,注释,类名来改变页面中的内容。具体写法为:

 var myComm = angular.module(‘mycommand‘, []);
            //名字中不要有特殊字符  ‘-‘
        myComm.directive(‘commandinfo‘, function() {
            //A 属性  E 元素 M 注释 C class

            return {
                restrict: ‘AEMC‘,
                template: ‘要修改的内容‘,
                replace: true
            }
        });

而且我们还可以对匹配到的对象进行很多其他的操作,具体就不一一列出了,因为太多了。

还有比较重要的一点就是angular中对ajax的写法:

首先对该作用域实现模块化: var mycon=angular.module("con",[]);

然后在控制器中实现ajax:  

mycon.controller(‘show‘,[‘$scope‘,‘$http‘,function($scope,$http){
            $http({
                method:"post",
                url:"/getname"
            }).success(function(d){
                $scope.info=d;
            })
        }]);

其实和jQuery中的写法差别不是很大,主要就是"$scope","$http"这两个参数。

其实angular中还有许许多多牛B的功能,但是介于在以后的工作中用到的机会比较小,所以就不具体的一一列出了。。。。

致以后可能会用到的angular(虽然没什么机会)

标签:style   http   io   color   ar   os   使用   sp   数据   

原文地址:http://www.cnblogs.com/zaxxm/p/4101558.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!