[AngularJS] Using the Angular scope $destroy event and method
With Angular scopes, you have access to a $destroy event that can be used to watch $scope events. This is used for cleanup, and gives you a final opportunity to access any data on a scope. Scopes also have a (rarely used) $destroy method that allows you to manually destroy a scope.
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"/> <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.18/angular.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="demo" ng-init="isToggled = true"> <div ng-if="isToggled"> <div ng-controller="MyCtrl as my">
Simple Form
<input type="text" ng-model="my.person.firstName"/>
<input type="text" ng-model="my.person.lastName"/>
Welcome, {{ my.person.firstName }} {{ my.person.lastName }}
<button ng-click="my.click()">Toggle</button>
</div> <my-directive></my-directive> </div> <hr/> </body>
</html>
angular.module("demo", [])
.factory("person", function () {
return {
firstName: "John",
lastName: "Lindquist"
}
})
.controller("MyCtrl", function ($scope, person) {
var my = this;
my.person = person;
my.click = function () {
$scope.$destroy();
}
})
.directive("myDirective", function () {
return {
restrict: "E",
scope: {},
template: "<div style='border: 1px solid black'>My Directive</div>",
link: function (scope) {
scope.$on("$destroy", function () {
console.log("directive destroy");
})
}
}
})
When you toggle ng-if, actually it triggle $scope.$destory.
Once $destory() is triggered, scope is destoried, no event and binding to the scope any more.
[AngularJS] Using the Angular scope $destroy event and method的更多相关文章
- [Angular] Use Angular components in AngularJS applications with Angular Elements
When migrating AngularJS (v1.x) applications to Angular you have different options. Using Angular El ...
- angularjs指令中的scope
共享 scope 使用共享 scope 的时候,可以直接从父 scope 中共享属性.因此下面示例可以将那么属性的值输出出来.使用的是父 scope 中定义的值. js代码: app.controll ...
- 【js类库AngularJs】解决angular+springmvc的post提交问题
[js类库AngularJs]解决angular+springmvc的post提交问题 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前 ...
- angular 中的$event 对象包含了浏览器原生的event对象
ou can pass the $event object as an argument when calling the function. The $event object contains t ...
- [AngularJS] Lazy loading Angular modules with ocLazyLoad
With the ocLazyLoad you can load AngularJS modules on demand. This is very handy for runtime loading ...
- [AngularJS] New in Angular 1.3 - Performance Boost with debugInfoEnabled
By default, Angular provides a lot of debug information on the DOM that's only necessary for tools l ...
- [AngularJS] New in Angular 1.5 ng-animate-swap
<!DOCTYPE html> <html ng-app="MyApplication"> <head> <link rel=" ...
- AngularJS进阶(五)Angular实现下拉菜单多选
Angular实现下拉菜单多选 写这篇文章时,引用文章地址如下: http://ngmodules.org/modules/angularjs-dropdown-multiselect http:// ...
- AngularJS进阶(四)ANGULAR.JS实现下拉菜单单选
ANGULAR.JS: NG-SELECT AND NG-OPTIONS PS:其实看英文文档比看中文文档更容易理解,前提是你的英语基础还可以.英文文档对于知识点讲述简明扼要,通俗易懂,而有些中文文档 ...
随机推荐
- svn import 向Google code里导入初始代码
其实很简单的问题,花费了这么多时间,想把初始代码导入到Google code里,用VisaulSVN插件的Switch功能也不可以,Google code上虽然有上传,但是只能单个文件传...... ...
- PHP强大的内置filter （二） 完
<?php #Sanitize filters #Sanitize filters 可以清理掉不规范的字符 # FILTER_SANITIZE_EMAIL 可以清理除了 字母和数字 以及 !#$ ...
- Hadoop学习笔记1---简介 优点 架构分析
一.Hadoop简介 Hadoop最早起源于Nutch.Nutch是一个开源的网络搜索引擎,由Doug Cutting于2002年创建.Nutch的设计目标是构建一个大型的全网搜索引擎,包括网页抓取. ...
- Lync激活用户遇到ConstraintViolationNoLeadingOrTrailingWhitespace错误
启用用户的时候出现错误ConstraintViolationNoLeadingOrTrailingWhitespace,如下图 解决方案:域控中,该用户的名字最后多出了个空格,批量生成域用户的脚本问题 ...
- html5 base64基础
base64常见的编码形式,二进制文件.图片.视频等 如何弄出来一个base64? a). FileReader readAsDataURL(); b). 工具 ...
- 通过ModuleImplAdvertisement向自定义服务传递参数
无意中发现通过ModuleImplAdvertisement可以向自定义服务传递参数,有空试一试. —————————————————————————————————————————————————— ...
- 常见的mongo shell命令
启动mongo shell 在windows下,双击mongo.exe可以启动mongo shell 查询库.表及选择库 查询所有库命令: show dbs 应用某一个db use jxs_datab ...
- ACM之数学题
数学题,始终记得,第一次被带飞师大校赛以及省赛,毫无例外的在数学题上卡死....因此,现在开始,有意识的保留遇见的数学题...(下列知识点按遇见先后顺序排列: 1欧拉公式 欧拉公式的用处是,找出小于N ...
- HDU 5437 Alisha’s Party （优先队列模拟）
题意:邀请k个朋友,每个朋友带有礼物价值不一,m次开门,每次开门让一定人数p(如果门外人数少于p,全都进去)进来,当最后所有人都到了还会再开一次门,让还没进来的人进来,每次都是礼物价值高的人先进.最后 ...
- iOS单例 宏定义
#define singleton_interface(className) \ + (className *)shared##className; // @implementation #defin ...