zoukankan      html  css  js  c++  java
  • angularjs 服务供应商

    <!DOCTYPE HTML>
    <html ng-app="myApp">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <style>
    #parent div{ 300px; height:500px; border:1px #000 solid; margin:20px;}
    #parent ul{ 200px; position:fixed; top:0; right:0;}
    </style>
    <script src="angular.min.js"></script>
    <script>
    //供应商:为对应的服务初始化相关配置
    
    
    var m1 = angular.module('myApp',[]);
    //interpolateProvider是interpolate(插值)的服务供应商,scopeProvider是scope的服务供应商。供应商的操作要在config里面写。
    m1.config(['$interpolateProvider',function($interpolateProvider){    
        //不用{{}}用@@@@。
        $interpolateProvider.startSymbol('@@');
        $interpolateProvider.endSymbol('@@');    
    }]);
    
    m1.controller('Aaa',['$scope','$interpolate',function($scope,$interpolate){    
        $scope.$watch('body',function(newBody){        
            if(newBody){
                var temp = $interpolate(newBody);
                $scope.showText = temp({ name : $scope.name });            
            }        
        });    
    }]);
    
    </script>
    </head>
    
    <body>
    <div ng-controller="Aaa">
        <input type="text" ng-model="name">
        <textarea ng-model="body">
        </textarea>
        <p>@@showText@@</p>
    </div>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html ng-app="myApp">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <style>
    #parent div{ 300px; height:500px; border:1px #000 solid; margin:20px;}
    #parent ul{ 200px; position:fixed; top:0; right:0;}
    </style>
    <script src="angular.min.js"></script>
    <script>
    
    var m1 = angular.module('myApp',[]);
    //$logProvider是$log服务的供应商。
    m1.config(['$interpolateProvider','$logProvider',function($interpolateProvider,$logProvider){
        $logProvider.debugEnabled(false);//禁用debug,则下面就不能打印hello.
    }]);
    
    m1.controller('Aaa',['$scope','$log',function($scope,$log){
        $log.debug('hello');
    }]);
    
    </script>
    </head>
    
    <body>
    <div ng-controller="Aaa">
       
    </div>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html ng-app="myApp">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <style>
    #parent div{ 300px; height:500px; border:1px #000 solid; margin:20px;}
    #parent ul{ 200px; position:fixed; top:0; right:0;}
    </style>
    <script src="angular.min.js"></script>
    <script>
    
    var m1 = angular.module('myApp',[]);
    
    //$anchorScrollProvider是anchorScroll的服务供应商,
    m1.config(['$anchorScrollProvider',function($anchorScrollProvider){
        $anchorScrollProvider.disableAutoScrolling();//禁止锚点跳转。
    }]);
    
    m1.controller('Aaa',['$scope','$location','$anchorScroll',function($scope,$location,$anchorScroll){
        $scope.change = function(id){    
            $location.hash(id);
            $anchorScroll();
        };
    }]);
    
    </script>
    </head>
    <body>
    <div id="parent" ng-controller="Aaa">
        <ul>
            <li ng-repeat="id in [1,2,3,4,5]" ng-click="change('div'+id)">{{id}}aaaaaaaaaa</li>
        </ul>
        <div ng-repeat="id in [1,2,3,4,5]" ng-attr-id="div{{id}}">{{id}}</div>
    </div>
    </body>
    </html>
  • 相关阅读:
    mybatis之关联关系映射
    spa项目开发之tab页实现
    mybatis整合redis实现二级缓存
    mybatis整合spring
    mybatis动态sql和分页
    Mybatis入门
    使用java代码操作redis
    Redis安装
    IDEA的安装和使用
    Linux入门——安装jdk、tomcat、MySQL以及项目部署
  • 原文地址:https://www.cnblogs.com/yaowen/p/5745917.html
Copyright © 2011-2022 走看看