• angularjs——module


    1、创建module

    //第一个参数是模块的名称
    var head=angular.module('headApp',[]);
    head.controller("User",["$scope",function($scope){
    	$scope.UserName="admin";
    	$scope.LoginTime=new Date().toString();
    }]);
    

    2、创建module且此模块要依赖其它module

    // 创建module且此模块要依赖其它模块
    // 第二个参数是依赖的模块名称,如果不依赖任何模块要传空数组[]。
    // 注意:如果第二个参数不传,则是获取当前名称的模块
    var my=angular.module('myApp',["headApp"]);
    my.controller("Content",["$scope",function($scope){
    	$scope.Text="this is a test page";
    }]);
    

    3、不同module有相同的controller时的调用方式

    //如果当前模块和依赖具有相同的controller,则会调用当前模块的controller。
    //当前模块没有此controller时,才会调用依赖模块中的controller
    //可以对下面的controller代码进行注释(或去掉注释),看页面的效果
    // my.controller("User",["$scope",function($scope){
    // 	$scope.UserName="admin123";
    // 	$scope.LoginTime="2015-7-25";
    // }]);
    

      

    demo代码如下:

    <!DOCTYPE html>
    <html lang="en" ng-app="myApp">
    <head>
    	<meta charset="UTF-8">
    	<title>模块化</title>
    	<script type="text/javascript" src="angular.js"></script>
    </head>
    <body>
    	<div ng-controller="User">
    		<p>用户名:{{UserName}}</p>
    		<p>登录时间:{{LoginTime}}</p>
    	</div>
    	<div ng-controller="Content">
    		<p>{{Text}}</p>
    	</div>
    </body>
    </html>
    <script type="text/javascript">
    	//创建module
    	//第一个参数是模块的名称
    	var head=angular.module('headApp',[]);
    	head.controller("User",["$scope",function($scope){
    		$scope.UserName="admin";
    		$scope.LoginTime=new Date().toString();
    	}]);
    
    	// 创建module且此模块要依赖其它模块
    	// 第二个参数是依赖的模块名称,如果不依赖任何模块要传空数组[]。
    	// 注意:如果第二个参数不传,则是获取当前名称的模块
    	var my=angular.module('myApp',["headApp"]);
    	my.controller("Content",["$scope",function($scope){
    		$scope.Text="this is a test page";
    	}]);
    
    	//不同module有相同的controller时的调用方式
    	//如果当前模块和依赖具有相同的controller,则会调用当前模块的controller。
    	//当前模块没有此controller时,才会调用依赖模块中的controller
    	//可以对下面的controller代码进行注释(或去掉注释),看页面的效果
    	// my.controller("User",["$scope",function($scope){
    	// 	$scope.UserName="admin123";
    	// 	$scope.LoginTime="2015-7-25";
    	// }]);
    </script>
    

      

    猛戳代码测试地址

  • 相关阅读:
    C#编码标准--编码习惯
    课程九,课堂测试
    JAVAweb 分级测试
    第八周 课堂报告
    javaweb界面
    12月9日,第一次自查报告
    课程管理系统后台JAVA代码
    《程序员修炼之道+从小工到专家》读后有感
    12月9日 自查后续
    课程管理系统JAVAweb前端代码
  • 原文地址:https://www.cnblogs.com/junjieok/p/4676713.html
Copyright © 2020-2023  润新知