[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:其实看英文文档比看中文文档更容易理解,前提是你的英语基础还可以.英文文档对于知识点讲述简明扼要,通俗易懂,而有些中文文档 ...
随机推荐
- C语言的 (强制类型转换) 以及 '字符字面值'
C语言的显式/隐式类型转换,都有一个中间变量的存在,原数据的类型.内容都不变. 以下代码,都用GCC编译. #include<stdio.h> int main() { char c = ...
- 谈layout_gravity和gravity的用法
相信对于Android的初学者来说,大家都曾经被layout里这两个极其相似的属性迷惑过. 简单使用一下搜索工具,我们就不难找到下面这样的答案: layout_gravity 表示组件自身在父组件 ...
- HTML的<head>中的内容总结
[01]文件头部一般包含标题标签.<meta>标签.内联样式表及预定义脚本等. [02]<meta>标签在网页内容中不显示,但它的作用不容忽视.<meta>标签主要 ...
- django1.77＋mod_wsgi+python2.79+apache2.24 在阿里云centos部署攻略
心平气和的记录一下今天 踩的坑以防万一 以后还踩 首先我今天的平台是在 阿里云上的一台纯净版的 centos6.5 64位主机上进行的 首先装python2.7 去官网下载python2.7安装包 然 ...
- 第三百三十七天 how can I 坚持
看了两集<太阳的后裔>,你眼中的你自己,真实的你自己,他眼中的你,你眼中的他,他眼中的他自己,真实的他自己.好乱. 何须让别人懂你,何须让自己懂自己,将就着一天天过吧. 睡觉.
- C++11角括号
[C++11角括号] 标准 C++ 的剖析器一律将 ">>" 视为右移运算符. 但在样板定义式中,绝大多数的场合其实都代表两个连续右角括号. 为了避免剖析器误判,撰码时 ...
- centos下安装mysql不能启动
初学者犯了个错误:yum安装mysql的命令是:yum -y install mysql-server,而不是yum -y install mysql ----------------------以下 ...
- IIS中的上传目录权限设置问题
虽然 Apache 的名声可能比 IIS 好,但我相信用 IIS 来做 Web 服务器的人一定也不少.说实话,我觉得 IIS 还是不错的,尤其是 Windows 2003 的 IIS 6(马上 Lon ...
- c# 调用zebra打印指令 打印到USB端口
c# 调用zebra打印机指令打印条码,如果直接打印到lpt1端口的打印机,通过copy指令没有问题, 但如果ZEBRA打印机是通过USB连接,打印机端口为usb001,则程序不能直接拷贝到usb00 ...
- POJ 3176 Cow Bowling （水题DP）
题意:给定一个金字塔,第 i 行有 i 个数,从最上面走下来,只能相邻的层数,问你最大的和. 析:真是水题,学过DP的都会,就不说了. 代码如下: #include <cstdio> #i ...