angular.js - Angular中控制器函数声明时的$scope到底是形参还是实参?

浏览:27日期:2023-02-07

问题描述

初学Angular遇到了点困惑,以下面这个控制器函数为例

function hello($scope) {$scope.name = ’张三’ }

这是个函数声明,$scope理应是形参吧?可是把$scope改为其他标识符如s就不行了。可见$scope是hello函数被调用时传入的实参。但这三行代码是函数的声明,怎么就传入实参了呢?

我大概意识到了这不是一个正常的函数声明,可能与Angular的控制器函数的绑定机制有关系?具体是怎样的?

问题解答

回答1:

这种通过参数进行传递获得依赖就是AngularJS的一大特性——依赖注入的体现之一。但为什么仅仅声明了参数就可以获得依赖?

AngularJS用$injector管理依赖的查询与加载,比如

// 使用注入器加载应用var injector = angular.injector([’ng’, ’myApp’]);// 通过注入器加载$controller服务var $controller = injector.get(’$controller’);var scope = injector.get(’$rootScope’).$new();// 加载控制器并传入一个作用域var MyController = $controller(’MyController’, {$scope: scope})

如果没有显示声明,$injector根据参数名推断依赖关系,这时候参数的顺序没什么意义。也就是说我们也可以这样声明:

angular.module(’myApp’).controller(’MyController’, [’$scope’, ’greeter’, function(renamed$scope, renamedGreeter) { //do something}]);回答2:

嗯这东西写在那里就是个函数声明,形参叫什么名字是否重要完全由读的人决定,ECMAScript 标准的解析器觉得不重要(我猜),但是 Angular 自己拿 js 写了个 'js' 解析器。。。这样函数形参的名字就重要了

回答3:

Scope(作用域)

AngularJS中的$scope 对象在这里就是要将 域模型 暴露给视图(模板)。只需把属性设置给scope实例,就可以在模板渲染时得到这个值。

Scopes(作用域)也可以针对特定的视图来扩展数据和特定的功能。只要在scope 实例上定义一些函数就能将特定的 UI 逻辑暴露给模板了。

例如,你可以给 name 变量创建一个 getter 方法,如下所示:

var HelloCtrl = function ($scope) { $scope.getName = function() { return $scope.name; };}

然后就像下面这样在模板中使用:<h1>Hello, {{getName()}} !</h1>

$scope 对象让我们可以非常精确的控制这个域内的模型的哪一部分,以及哪些操作在视图层是可用的。理论上来讲,AngularJS的scopes非常类似于MVVM模式的ViewModel。

http://note.sdo.com/u/635412003927148913/n/s6cBN~lcIHwG4M1-Y000LW

相关文章: