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的更多相关文章

  1. [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 ...

  2. angularjs指令中的scope

    共享 scope 使用共享 scope 的时候,可以直接从父 scope 中共享属性.因此下面示例可以将那么属性的值输出出来.使用的是父 scope 中定义的值. js代码: app.controll ...

  3. 【js类库AngularJs】解决angular+springmvc的post提交问题

    [js类库AngularJs]解决angular+springmvc的post提交问题 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前 ...

  4. angular 中的$event 对象包含了浏览器原生的event对象

    ou can pass the $event object as an argument when calling the function. The $event object contains t ...

  5. [AngularJS] Lazy loading Angular modules with ocLazyLoad

    With the ocLazyLoad you can load AngularJS modules on demand. This is very handy for runtime loading ...

  6. [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 ...

  7. [AngularJS] New in Angular 1.5 ng-animate-swap

    <!DOCTYPE html> <html ng-app="MyApplication"> <head> <link rel=" ...

  8. AngularJS进阶(五)Angular实现下拉菜单多选

    Angular实现下拉菜单多选 写这篇文章时,引用文章地址如下: http://ngmodules.org/modules/angularjs-dropdown-multiselect http:// ...

  9. AngularJS进阶(四)ANGULAR.JS实现下拉菜单单选

    ANGULAR.JS: NG-SELECT AND NG-OPTIONS PS:其实看英文文档比看中文文档更容易理解,前提是你的英语基础还可以.英文文档对于知识点讲述简明扼要,通俗易懂,而有些中文文档 ...

随机推荐

  1. git 换行符问题

    git 换行符问题 在windows环境中 对于autocrlf = false 不会激发 关于换行符的处理 对于autocrlf = true 会在提交是将LF替换成CRLF 切出时时CRLF 对于 ...

  2. 判断浏览器是IE的几种方式

    <script> if(!+[1,])alert("这是ie浏览器"); else alert("这不是ie浏览器"); </script&g ...

  3. 为网页设计师准备的30个使用的HTML5框架

    原文地址:http://www.goodfav.com/zh/html5-framework-8189.html 网页设计师在开始使用一些应用程序之前需要考虑几个事实,以确保在应用Web程序框架时,这 ...

  4. s3c2440串口裸板驱动(使用fifo）

    使用fifo的好处有: 1:串口的数据发送的数据量较大时,使用fifo可以大大降低MCU的开销.(有点类似串入并出的cput处理模型,本质上还是串行收发) 2:在某些特殊场合,例如制定较复杂的协议时, ...

  5. Chapter 3 Start Caffe with MNIST Demo

    先从一个具体的例子来开始Caffe,以MNIST手写数据为例. 1.下载数据 下载mnist到caffe-master\data\mnist文件夹. THE MNIST DATABASE:Yann L ...

  6. Codeforces Educational Codeforces Round 15 D. Road to Post Office

    D. Road to Post Office time limit per test 1 second memory limit per test 256 megabytes input standa ...

  7. Northwind数据库表字段介绍

    ① Categories:种类表 相应字段: CategoryID :类型ID: CategoryName:类型名; Description:类型说明; Picture:产品样本 ② Customer ...

  8. C#完整的通信代码（点对点，点对多，同步，异步，UDP，TCP)

    C# code namespace UDPServer { class Program { static void Main(string[] args) { int recv; byte[] dat ...

  9. Multimedia&Network

    [Multimedia&Network] 1.Unity3D共支持4种格式音乐文件: 2.AudioSource用于指明音频源,被绑定在一个GameObject身上.光有AudioSource ...

  10. PPPOE拨号演练

    搭建PPPOE服务器,拓扑如下 PPP-Server配置如下: (config)#bba-group pppoe global (config-bba-group)#virtual-template ...