AngularJS实战_学习笔记

首页免费课 AngularJS实战笔记

AngularJS实战

最热最新

狼狼的蓝胖子 06:26

Controller使用的注意事项

查看全部

1 采集收起来源：MVC（2）——如何使用Controller
2018-03-22
张小溪
```
html和js,MVC的视频案例
```
<!DOCTYPE HTML>
<html ng-app="HelloAngular">
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="js/bootstrap/bootstrap/css/bootstrap.min.css" />
<script src="js/angular-1.3.0.js"></script>
<script src="HellowAngular.js"></script>
<style type="text/css">
.show-scope-demo .ng-scope,.show-scope-demo .ng-scope {
border: 1px solid #2196f3;
margin: 3px;
}
</style>
</head>

<body>

<div>

<input ng-model="demo.text"/>

<p>{{demo.text}},hello!</p>
</div>
<p>{{demo.text}}</p>


<div ng-controller="angularFunction">
<p>{{greeting.text}},angular-function</P>
</div>


<hello></hello>


<div ng-controller="rootController">
<div ng-controller="controller1">
<p>{{greeting1.text}},controller1!</p>
<button ng-click="text1()">text1</button>
</div>
<div ng-controller="controller2">
<p>{{greeting2.text}},controller2</p>
<button ng-click="text2()" type="button" >text2</button>
</div>

<button ng-click="rootText()" type="button" class="btn btn-primary btn-xs">rootText</button>
</div>


<div class="show-scope-demo" >
<div ng-controller="greetingCtrl">
<p>{{name}}</p>
</div>
<div ng-controller="listCtrl">
<div ng-repeat="name in names">
遍历:{{name}},根节点数据:{{department}}!
</div>
</div>
</div>

<span>这是无关的Angular的标签!</span>


<div ng-controller="EventController">
Root scope
<tt>MyEvent</tt>count : {{count}}
<ul>

<li ng-repeat="i in [1]" ng-controller="EventController">

<button type="button" ng-click="$emit('MyEvent')">$emit('MyEvent')</button>

<button type="button" ng-click="$broadcast('MyEvent')">$broadcast('MyEvent')</button>
<br/>
Middle scope
<tt>MyEvent</tt> count: {{count}}
<ul>
<li ng-repeat="itme in [1,2]" ng-controller="EventController">
Leaf scope
<tt>MyEvent</tt> count: {{count}}
</li>
</ul>
</li>
</ul>
</div>

</body>

</html>
var myModel = angular.module("HelloAngular",[]);
myModel.controller("angularFunction",['$scope',
function angularFunction($scope){
$scope.greeting = {
text:"HelloWord-Angular"
};
}
]);
myModel.directive('hello',function(){
return{
restrict: 'E',
template: '<div>Hi everyone!</div>',
replace: true
}
});

myModel.controller("rootController",['$scope',
function rootText($scope){
$scope.rootText = function(){
alert("rootText!");
};
}
]);

myModel.controller("controller1",['$scope',
function($scope){
$scope.greeting1 = {
text : "controller1"
};
$scope.text1 = function(){
alert("controller1");
}
}
]);

myModel.controller("controller2",["$scope",
function text2($scope){
$scope.greeting2 = {
text : "controller2"
};
$scope.text2 = function(){
alert('controller2');
};
}
]);

myModel.controller("greetingCtrl",["$scope","$rootScope",
function($scope,$rootScope){
$scope.name = "张三";
$rootScope.department = "不同Controller共用的作用域";
}
]);

myModel.controller("listCtrl",["$scope",
function($scope){
$scope.names = ['张三','李四','王五'];
}
]);

myModel.controller("EventController",["$scope",
function($scope){
$scope.count = 0;
$scope.$on("MyEvent",function(){
$scope.count++;
});
angular.element($0).scope();//调试
}
]);
查看全部

1 采集收起来源：双向数据绑定（1）
2018-08-23
qq_黑色契约_0 00:17

karma 跑单元测的一个容器，没有编写单元测的语法要结合Jasmine

查看全部

1 采集收起来源：开发、调试、测试工具（5）
2018-07-14
文欣

何为创新？创造新的东西，便是创新。历经前人所没有经历过的，那便是创新。创新不仅仅是个人，还有民族，还有世界。创新的力量，便是支持着一个人活下去的动力，那是支持一个国家站着发展的动力，那可是推动了一个时代被尊崇的荣耀。其实我想说一句真实的话：与国界无关，与尊严也无关。众所皆知，中国历史文化悠久，拥有5000多年的历史。在这漫长的岁月中，我们的祖先用他们的智慧创造了当时世界上一个又一个壮举，至今还影响着人民的生活。可是到了晚清时期，为什么会遭到欧洲资本主义国家的侵略，签订了一系列不平等条约，究其根本：就是天朝自以为是，所谓的地大物博、闭关锁国政策，封闭了国门，停滞不前。那段时期正是国外各种技术创新发展的黄金时期，欧洲从此走上了工业化道路，而我们却浑然不知，还停留在古老的农业封建主义社会，巨大的反差，才有了那段屈辱的历史，历史告诉我们：创新是国家是社会发展不可缺少的一部分

查看全部

1 采集收起来源：MVC（3）
2015-07-06
qq_途经_0 07:39

$emit('myEvent') 同级及向上传播事件
$broadcast('myEvent') 同级及向下传播事件
两者传播的事件可通过：
$scope.$on('myEvent',function(){
$scope.count++;
});获取并操作

查看全部

1 采集收起来源：MVC（3）
2018-05-14
兴光军 01:19

四个核心特性：MVC,模块化,指令系统,双向数据绑定

查看全部

1 采集收起来源：快速上手
2015-03-21
叶子2015

http://www.html-js.com/article/1863

查看全部

1 采集收起来源：$scope与双向数据绑定机制分析（2）
2018-01-19
执著丶0 10:26

compile和link一般不同时使用（同时使用link会失去作用）。

查看全部

1 采集收起来源：指令的执行过程分析（1）
2017-09-05
奋斗_努力 02:03

独立作用域：是为了在一个页面上重复使用同一个自定义指令而不会相互影响

查看全部

1 采集收起来源：指令（4）
2015-03-25
Wingsdark 09:59

项目结构图

查看全部

1 采集收起来源：路由、模块、依赖注入
2017-08-22
慕侠0865470 20:28

一切从模块开始

查看全部

1 采集收起来源：路由、模块、依赖注入
2017-07-20
qq_云淡风轻_89

angular4大核心特性mvc,模块化,指令系统,双向数据绑定

查看全部

1 采集收起来源：快速上手
2017-06-24
zei010203 12:04

双向数据绑定

查看全部

1 采集收起来源：快速上手
2015-03-01
Heroor 11:16

ensure();//方法拷贝

查看全部

1 采集收起来源：AngularJS的启动过程（2）
2017-05-29
永恒梦境

MVC的目的是为了模块化和复用!

查看全部

1 采集收起来源：MVC（2）——如何使用Controller
2017-05-29