#定义应用
通过为任一HTML标签添加ng-app属性
可以指定一个应用,表示此标签所包裹的内容都属于应用(App)的一部分。
为html添加ng-app表明增个文档都是应用
//ng-app可以不赋值,但是关联整个模块的时候必须赋值
<html lang = en ng-app="app">
#定义模块
AngularJS提供了一个全局对象angular,
在此全局对象下存在若干的方法,
其中angular.module()方法用来定义一个模块。
//通过moudle方法定义模块
//需要传递两个参数,第一个表示模块的名称
//第二个表示此模块依赖其它模块
var app = angular.moudle('app',[]);
应用(App)其本质也是一个模块(一个比较大的模块)。
#定义控制器
控制器(Controller)作为连接模型(Model)和视图(View)
的桥梁存在,所以当我们定义好了控制器以后也就定义好了模型和视图。
//app是一个模块实例对象
//通过这个实例对象定义控制器
//需要两个参数第一个参数表示这个控制器名称
//第二个参数是一个数组,这个数组除最后一个单元是函数外
//其余都是字符串.
app.controller('StudentController',['$scope',function($scope){
//模型 moudle
$scope = [
{name:'xxx',sex:'不详',age:30},
{name:'xxx',sex:'男',age:12}
]
}])
#控制器和视图的关联
模型(Model)数据是要展示到视图(View)上的,
所以需要将控制器(Controller)关联到视图(View)上,
通过为HTML标签添加ng-controller属性并赋值相应的
控制器(Controller)的名称,就确立了关联关系。
//添加ng-controller属性,并赋值为相应的控制器名称
<div ng-controller = 'StudentController'>
<div ng-repeat= "student in students">
<h3>{{student.name}}</h3>
<h3>{{student.sex}}</h3>
<h3>{{student.age}}</h3>
</div>
</div>
以上步骤就是AngularJS最基本的MVC工作模式。
通过为任一HTML标签添加ng-app属性
可以指定一个应用,表示此标签所包裹的内容都属于应用(App)的一部分。
为html添加ng-app表明增个文档都是应用
//ng-app可以不赋值,但是关联整个模块的时候必须赋值
<html lang = en ng-app="app">
#定义模块
AngularJS提供了一个全局对象angular,
在此全局对象下存在若干的方法,
其中angular.module()方法用来定义一个模块。
//通过moudle方法定义模块
//需要传递两个参数,第一个表示模块的名称
//第二个表示此模块依赖其它模块
var app = angular.moudle('app',[]);
应用(App)其本质也是一个模块(一个比较大的模块)。
#定义控制器
控制器(Controller)作为连接模型(Model)和视图(View)
的桥梁存在,所以当我们定义好了控制器以后也就定义好了模型和视图。
//app是一个模块实例对象
//通过这个实例对象定义控制器
//需要两个参数第一个参数表示这个控制器名称
//第二个参数是一个数组,这个数组除最后一个单元是函数外
//其余都是字符串.
app.controller('StudentController',['$scope',function($scope){
//模型 moudle
$scope = [
{name:'xxx',sex:'不详',age:30},
{name:'xxx',sex:'男',age:12}
]
}])
#控制器和视图的关联
模型(Model)数据是要展示到视图(View)上的,
所以需要将控制器(Controller)关联到视图(View)上,
通过为HTML标签添加ng-controller属性并赋值相应的
控制器(Controller)的名称,就确立了关联关系。
//添加ng-controller属性,并赋值为相应的控制器名称
<div ng-controller = 'StudentController'>
<div ng-repeat= "student in students">
<h3>{{student.name}}</h3>
<h3>{{student.sex}}</h3>
<h3>{{student.age}}</h3>
</div>
</div>
以上步骤就是AngularJS最基本的MVC工作模式。