AngularJS ng-init 应用初始化时定义变量

最新推荐文章于 2020-05-29 19:24:04 发布
最新推荐文章于 2020-05-29 19:24:04 发布
阅读量4.9k 收藏 1
点赞数
分类专栏： AngularJS 文章标签： angularjs ng-init
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/houyanhua1/article/details/80116907
版权


demo.html：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>AngularJS</title>
	<script src="angular.min.js"></script>  <!-- 引入AngularJS框架 -->
</head>
<body ng-app="App">
	
	<div ng-controller="DemoController" ng-init="name='张三';age=12">  <!-- ng-init初始化,定义数据内容 -->
		<h1 ng-cloak>{{name}} {{age}}</h1>  <!-- 使用ng-init时定义的变量。ng-cloak为了避免{{}}闪烁 -->
	</div>

	<script>
		// 创建模块
		var App = angular.module('App',[]);

		App.controller("DemoController",['$scope',function($scope) {
			// $scope相当于MVC中的Model
			// $scope.name = "张三";  // 可以通过ng-init初始化时定义name 来代替。
			
		}]);
		
	</script>
</body>
</html>


houyanhua1
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
AngularJS基础 ng-init 指令简单示例
10-21
本文主要介绍AngularJS ng-init 指令,这里帮大家整理了关于ng-init 指令的基本知识资料,并附有简单的代码示例,有需要学习的小伙伴可以参考下
02-指令-ng-init
不羁放纵爱自由的博客
07-24 402
<!--ng-init指令 用于声明模型数据(变量) 可以在整个ng-app内使用 可以初始化数组、对象 、字符串、数值 但是我并不推荐使用这种方式来声明变量--><!DOCTYPE html> <html lang="en" ng-app=""> <head> <meta charset="UTF-8"> <title>Document</title> <script sr
AngularJS：ng表达式、ng-init作用、ng数据模型、数据遍历、ng-repeat作用
weixin_43731793的博客
08-06 583
ng表达式: 1.{{表达式}} <div class="well">{{val1*val2}}</div> 2.{{$tot}} 1)视图 <div class="well">{{tot()}}</div> 2)控制器 app.controller('myctl',function($scope){ //控制器代码逻辑范围 $sco...
AngularJS1 -- ng-init
住在地球的攻城狮
08-21 369
ng-init指令初始化应用程序数据。 ng-init指令执行给定的表达式。 ng-init指令添加一些不必要的逻辑到 scope 中，建议你可以在控制器中ng-controller指令执行它 。 语法 <element ng-init="expression"></element> 所有的 HTML 元素都支持该指令。 expression ...
angularJS 初始化
djp0910的博客
09-02 284
AngularJS 启动有两种方式 1、绑定初始化，自动加载 通过绑定来进行angular的初始化，会把js代码侵入到html中。 ng-app是angular的一个指令，代表一个angular应用（也叫模块）。使用ng-app或ng-app=""来标记一个DOM结点，让框架会自动加载。也就是说，ng-app是可以带属性值的。 <body ng-app="myApp"&...
angular编辑-初始化变量失败
weixin_33831673的博客
08-24 431
编辑的初始化，根据点击编辑项获取的id，从后台获取这个id的所有信息，然后将对应的字段初始化给前台的页面。 大部分的时候我们都不需要做什么特殊处理，因为当我们获取到了对象，通过angularjs的双向绑定就会直接为我们做好初始化的工作。但是为什么这次我单拿出来记录呢？必然是有不同的地方。 这次编辑出现问题的点主要是在前台设计的时候，其中有...
AngularJs ng-change事件/指令的用法小结
01-19
本文介绍了AngularJs ng-change事件/指令的小结，分享给大家，也给自己留个笔记 定义和用法 ng-change 指令用于告诉 AngularJS 在 HTML 元素值改变时需要执行的操作。 ng-change 指令需要搭配 ng-model 指令使用。...
AngularJS ng-mousedown 指令
12-29
AngularJS ng-mousedown 指令 AngularJS 实例 在鼠标按下时执行表达式： <!DOCTYPE html> <html> <head> <meta charset=utf-8> [removed][removed] </head> <body ng-app=> ...
AngularJS ng-bind 指令简单实现
01-19
AngularJS ng-bind 指令 AngularJS 实例 绑定 <p> 内的 innerHTML 到变量 myText: <!DOCTYPE html> <html> <head> <meta charset=utf-8> [removed][removed] </head> <body> ...
angularJS变量初始化问题探讨
jupiter_888的博客
10-05 314
1、 不需要初始化变量 1）ng-model绑定变量一般不需要初始化的，ng-model会自动初始化变量（ng-model是在有值才初始化对象） 特点：如果在ng-model填写值之前使用对象，此对象必须初始化； 2）直接在$scope域下面绑定第一级变量不需要初始化， 例如： $scope.url=data; 2、需要初始化的对象 1）$scope域下面绑定了对象，且此对象调用...
Angular 指令
YYece的博客
10-23 266
什么是指令 Angular通过被称为指令的属性来扩展HTML AngularJS 通过内置的指令来为应用添加功能。 AngularJS 允许你自定义指令。 指令长成啥样 以ng-开头，比如ng-app、ng-bind等 <!DOCTYPE html> <html lang="en" ng-app> <body> <div ng-init="fir...
angularjs伴随ng-init等指令产生的作用域
我要上天一起吗？的博客
05-29 577
前两天想用ng-init做条件判断的桥梁时出现了一次失败，做了一个测试，发现angular的局部作用域影响ng-init定义的值。 ng-init的作用就是创建一个变量(bb) 一般情况下，和$scope.bb的作用一样，不同的是，ngInit是指令，有局部作用域，优先级更高。 可以理解为在ngInit的作用域 $ngInitScope内又定义了一个 $ngInitScope.bb = $ngInitScope.website1，而且是双向绑定 <div ng-init="bb=website1".
angularjs指令
待归魔帝的博客
11-08 468
var app = angular.module("myApp",[]); app.directive("myFile",function(){ return { template:'这是自定义指令' } }); angularjs指令的作用： angularjs是通过指令来扩展html。 angularjs通过内置的指令来为应用添加功能。 什么是angularjs指令？ an
使用angularjs的ng-options时如何设置默认值(初始值)
xinghuowuzhao的博客
08-29 1202
这两天我用ng-options过程中遇到的初始值为空白的问题，记得去年就遇到过，怎么解决的忘记了，费了一阵子功夫之后解决了，想记下来，方便遇到同样问题的小伙伴当然还有自己。   1.场景：       就是做一个查询列表的弹窗，其中有一个条件需要用到下拉菜单，数据是用过ajax传递过去的。       
angular的ng-init指令
lixiaoyan_star的博客
05-07 791
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></scri...
angular.js初始化命令 ng-init，ng-bind
12-21 7883
在angular.js可以通过ng-init来初始化所需要的数据。而不需要通过其他方式再去渲染一遍。 如下代码所示：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body ng-app ng-init="msg='hello'"> <div id=
AngularJS 初始化指令- ng-init
Json1204的专栏
04-15 5245
姓名为 ng-init 指令初始化 AngularJS 应用程序变量。
[angularJS] ng-init注意事项
中年油腻男人的转型之路
05-06 2765
1)  ng-init="dIndex7 = 7" 此变量dIndex7的变量名不能和这个文件中任何其中的菜单的名字一样.因为jsp文件同一个变量值只会和最后一次的ng-init值一致.2) dIndex7 = 7的初始化值也不能和其他的dIndex一致. 因为是否显示子菜单与hideSubMenu数组的下标有关, 如果初始化值一样, 这两个菜单的子菜单为同时打开与关闭....
ng-init的妙用
热门推荐
小新正在敲代码
01-11 1万+
大多数人都知道ng-init里面可以放一个表达式，用来初始化当前作用域中的模型的值。 可是，今天，我想告诉大家一个ng-init的一个不一样的用法。 我先介绍一下使用该方法的一个场景： 比如，一个页面中的select元素，如果你不绑定作用域的值的话，那么默认什么都不选中。 现在，我这个页面可能和作用域绑定，这时select会默认显示绑定的值。也可能没和作用域绑定，此时，什么都不显示。 而我
设置Servlet的init-param初始化参数有什么意义
最新发布
07-08
设置Servlet的init-param初始化参数的意义在于为Servlet提供配置信息，以便在Servlet初始化时能够动态地加载这些参数。通过在web.xml文件中配置init-param，可以将特定的参数传递给Servlet，以便根据需要进行自定义...

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值