- Switching to Angular(Third Edition)
- Minko Gechev
- 225字
- 2021-07-02 15:23:30
Scope
Data binding in AngularJS is achieved using the scope object. We can attach properties to it and explicitly declare in the template that we want to bind to these properties (one- or two-way). Although the idea of the scope seems clear, it has two more responsibilities, including event dispatching and the change detection-related behavior.
Angular beginners have a hard time understanding what scope really is and how it should be used. AngularJS 1.2 introduced something called controller as syntax. It allows us to add properties to the current context inside the given controller (this), instead of explicitly injecting the scope object and later adding properties to it. This simplified syntax can be demonstrated through the following snippet:
<div ng-controller="MainCtrl as main"> <button ng-click="main.clicked()">Click</button> </div>
function MainCtrl() { this.name = 'Foobar'; } MainCtrl.prototype.clicked = function () { alert('You clicked me!'); };
The latest Angular took this even further by removing the scope object. All the expressions are evaluated in the context of the given UI component. Removing the entire scope API introduces higher simplicity; we don't need to explicitly inject it anymore, instead, we add properties to the UI components to which we can later bind. This API feels much simpler and more natural.
We will take a more detailed look at the components and the change detection mechanism of Angular in Chapter 5, Getting Started with Angular Components and Directives.
- 微服務設計(第2版)
- Java面向對象軟件開發
- 數據結構(Python語言描述)(第2版)
- C++程序設計基礎教程
- INSTANT OpenNMS Starter
- Learning Three.js:The JavaScript 3D Library for WebGL
- INSTANT Passbook App Development for iOS How-to
- Unity Character Animation with Mecanim
- Tableau Desktop可視化高級應用
- Clojure for Finance
- Spring Boot 3:入門與應用實戰
- 循序漸進Vue.js 3前端開發實戰
- C++ Data Structures and Algorithm Design Principles
- 新手學Visual C
- 企業應用架構模式