AngularJS控制器controller给模型数据赋初始值的方法
本文实例讲述了AngularJS控制器controller给模型数据赋初始值的方法。分享给大家供大家参考,具体如下:
之前的文章《AngularJS入门示例之Hello World详解》,很简单的就实现了模型数据和页面显示的自动绑定。现在我们使用控制器,给模型赋初始值。如果使用jQuery来实现变量赋初值,需要在页面加载完成后执行
$("#target").attr("value",selfValue);
使用AngularJS代码如下:
<!doctype html> <html lang="en" ng-app> <head> <meta charset="utf-8"> <title>Hello,World!</title> <script src="angular1.2.25.js"></script> <script> function WholeController($scope) { $scope.yourName = "aty"; } </script> </head> <body ng-controller="WholeController"> <input type="text" ng-model="yourName"> <h1>Hello, {{yourName}}</h1> </body> </html>
这里需要注意:函数名必须与ng-controller中的名称一致,函数的参数$scope名次也是固定的,不能随便修改。这样的话,AngularJS框架会自动执行我们的控制器,并将作用域对象注入到函数参数。很显然这种方式非常不好,因为不能改变函数参数名,后面我会看到还有别的方式来达到同样的目的,后续我们再继续学习。可以看到Controller就是一个JavaScript 函数,在 Angular 里,当这个函数通过 ng-controller 指令绑定到 DOM 上的时候,这个函数就是 Controller 了,我们可以为 Controller Scope 对象。
更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
- AngularJS控制器controller正确的通信的方法
- AngularJs学习第五篇从Controller控制器谈谈$scope作用域
- 详解Angularjs在控制器(controller.js)中使用过滤器($filter)格式化日期/时间实例
- AngularJS 控制器 controller的详解
- AngularJS利用Controller完成URL跳转
- Angularjs中controller的三种写法分享
- angularJS+requireJS实现controller及directive的按需加载示例
- Angularjs的Controller间通信机制实例分析
- AngularJS实现controller控制器间共享数据的方法示例
相关文章
解决nodejs中使用http请求返回值为html时乱码的问题
下面小编就为大家带来一篇解决nodejs中使用http请求返回值为html时乱码的问题。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧2017-02-02AngularJS基础 ng-non-bindable 指令详细介绍
本文主要讲解AngularJS ng-non-bindable 指令,这里帮大家整理了ng-non-bindable指令的基本知识资料,有需要的小伙伴可以参考下2016-08-08详解如何在Angular应用中发起HTTP 302 redirect
这篇文章主要介绍了如何在Angular应用中发起HTTP 302 redirect详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-12-12angularjs实现table表格td单元格单击变输入框/可编辑状态示例
这篇文章主要介绍了angularjs实现table表格td单元格单击变输入框/可编辑状态,涉及AngularJS事件响应及页面table元素属性动态操作相关实现技巧,需要的朋友可以参考下2019-02-02体验jQuery和AngularJS的不同点及AngularJS的迷人之处
AngualrJS是一个很贴心的web应用框架,本篇通过jQuery和Angular两种方式来实现同一个实例,从而体验两者的不同点以及AngularJS的迷人之处2016-02-02
最新评论