Question

嗨，我正在学习角度，并且已经忘记了解＆＃39; ，＆＃39;这＆＃39; 和＆＃39; $范围＆＃39;
。虽然我读了这篇link，但它超越了我的脑袋当我使用ng-controller="myController as ctrl"时，我只能访问此上的变量和函数集。
定义ng-controller="myController"我只能访问 $ scope 上的变量和函数集有人可以深入解释这个话题吗？

Answer 1

关键字var是纯粹的javascript，就是你在javascript中声明变量的方式。像这样：

var myName = 'Nikolaj';
var myAge = 1700;
// etc.

如果你不熟悉var，你应该在冒险进入Angular之前先学习Javascript，因为Angular的学习曲线可能非常陡峭。

据说我会尝试解释其他概念。

使用controllerAs

使用推荐的controllerAs语法时，您将获得模板中控制器实例的引用。当您使用<div ng-controller="myController as ctrl"></div>;

时会发生这种情况

您的控制器基本上是＆＃34;新的＆＃34;并存储在名为ctrl的变量中，该变量在角度模板中可用。这允许您在模板中访问控制器成员（公共函数和变量），如下所示：

<div ng-controller="myController as ctrl">
    <p>{{ctrl.name}}</p>
</div>

为了使变量name在模板中可用，必须首先将其声明为控制器的公共成员/变量。这就是this - 关键字发挥作用的地方。在创建控制器时，为了使变量name公开，您可以这样做：

angular.module('app').controller('myController', function(){
    this.name = 'My name variable';
});

这里this是Javascript中的一个特殊概念，它是对函数上下文的引用 - 但只是基本的Javascript。

使用$ scope

当你改为使用你的控制器时：<div ng-controller="myController"></div>你无法直接访问模板中的控制器实例。相反，每次在Angular表达式中使用某些内容时，例如{{name}}，Angular会隐式假设$ scope变量中存在变量name。每个控制器在链接到模板时都有一个与其关联的$ scope变量。要在控制器主体内访问此变量，您可以像这样访问它：

angular.module('app').controller('myController', function($scope){
    $scope.name = 'My name variable';
});

建议使用 controllerAs 语法的原因部分是因为在使用$ scope时，当您有多个嵌套作用域时，很难确定您指的是哪个范围（即嵌套控制器）。如下例所示：

<div ng-controller="FirstController">
    <h1>{{firstControllerVariable}}</h1>
    <div ng-controller="SecondController">
        <h2>{{whereDoIBelong}}</h2>
    </div>
</div>

使用controllerAs语法，很清楚哪个变量属于哪个控制器：

<div ng-controller="FirstController as first">
    <h1>{{first.firstControllerVariable}}</h1>
    <div ng-controller="SecondController as second">
        <h2>{{second.iKnowWhereIBelong}}</h2>
    </div>
</div>

使用controllerAs语法的另一个原因是因为它可以更容易地迁移到ES2016及更高版本。

在AngularJS（1.4）中{var vs this vs $ scope}

1 个答案: