angularjs中基本功能用法

最新推荐文章于 2019-06-29 17:08:05 发布

kobewangbo

最新推荐文章于 2019-06-29 17:08:05 发布

阅读量765

点赞数

分类专栏： web 文章标签： angularjs

本文链接：https://blog.csdn.net/kobewangbo/article/details/77121391

版权

web 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文整理了在学习angularjs中基本功能的用法，适合初学者查阅基本用法

基本功能

1. 自定义过滤器

    <body>
        <div ng-controller="myAppCtrl">
            {{name | test }}
        </div>
        <script type="text/javascript">
            var myAppModule = angular.module('myApp',[]);
            
            myAppModule.filter('test',function(){
                return function(name){
                    return 'hello, '+name+'!';
                };
            });

            myAppModule.controller('myAppCtrl',['$scope',function($scope){
                $scope.name='wb';
            }]);
        </script>
    </body>

自定义过滤器的回掉函数中，返回一个方法

2.自定义指令

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

            myAppModule.directive("test",function(){
                return{
                    restrict:'AECM', //A属性；E元素标签；C CSS Class；M评论
                    template:'<div>hello my directive</div>',
                    replace:true
                }
            });

自定义指令返回一个对象，json格式，定义了特定属性

3.自定义服务

创建服务可以通过三种方式，factory,provider和service

factory方法：factory是工厂，回掉函数返回一个类对象，类对象中含有方法供其他控制器使用

service方法：

provide方法：

关于自定义的服务，有下面几点需要注意：

　　1 使用场景：可以把多个控制器中相同的功能抽取出来，形成一个服务。

　　2 单例：服务都是单例的，一个应用生命周期内，只有一个服务的实例存在。

　　3 注入器：服务的实例化都是有注入器injector创建的。在我们创建controller控制器时，后面指明了需要注入一个myService服务，注入器就会去实例化该服务，依赖注入有三种方式。

4.watch监控

 $scope.$watch('xxx',function(xxx){xxxx})

在监控器中定义，监控xxx变量，如果发生变化，则触发回掉函数

kobewangbo

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularjs中基本功能用法

本文整理了在学习angularjs中基本功能的用法，适合初学者查阅基本用法
复制链接

扫一扫

专栏目录

angularjs中基本功能用法

基本功能

1. 自定义过滤器

2.自定义指令

“相关推荐”对你有帮助么？