我应该使用`this`还是`$ scope`？

Question

有两种模式用于访问控制器功能: this和$scope.

我应该在何时使用？我理解this是设置为控制器,并且$scope是视图范围链中的对象.但是使用新的"Controller as Var"语法,您可以轻松使用它们.所以我要问的是什么是最好的,未来的方向是什么？

例:

运用 this

function UserCtrl() {
  this.bye = function() { alert('....'); };
}

<body ng-controller='UserCtrl as uCtrl'>
  <button ng-click='uCtrl.bye()'>bye</button>

运用 $scope

function UserCtrl($scope) {
    $scope.bye = function () { alert('....'); };
}

<body ng-controller='UserCtrl'>
    <button ng-click='bye()'>bye</button>

我个人发现,this.name与其他Javascript OO模式相比,它更容易上手,更自然.

建议好吗？

Answer 1

两者都有它们的用途.首先,一些历史......

$ scope是"经典"技术,而"控制器为"更新近(从版本1.2.0开始,虽然它确实出现在此之前的不稳定的预发行版中).

两者都工作得很好,唯一错误的答案是在没有明确原因的情况下将它们混合在同一个应用程序中.坦率地说,混合它们会起作用,但它只会增加混乱.所以选择一个并滚动它.最重要的是保持一致.

哪一个？这取决于你.还有更多的范围有$ scope,但"控制器为"也在增加.这个比那个好吗？这是值得商榷的.那你怎么选择？

安慰

我更喜欢"控制器为",因为我喜欢隐藏$ scope并通过中间对象将控制器中的成员暴露给视图.通过设置此.*,我可以将我想要从控制器公开的内容暴露给视图.您也可以使用$ scope执行此操作,我更喜欢使用标准JavaScript.事实上,我这样编码:

var vm = this;

vm.title = 'some title';
vm.saveData = function(){ ... } ;

return vm;

这对我来说感觉更干净,并且可以很容易地看到暴露在视图中的内容.注意我将变量命名为"vm",它代表viewmodel.那只是我的惯例.

使用$ scope我可以做同样的事情,所以我不会添加或减少该技术.

$scope.title = 'some title';
$scope.saveData = function() { ... };

所以它取决于你.

注射

使用$ scope我需要将$ scope注入控制器.我没有必要用控制器这样做,除非我出于其他原因需要它(如$ broadcast或watch,尽管我试图避开控制器中的手表).

对.在这种情况下,$ scope仍然使用,但它更多地用作服务.当我们注入角度服务($ scope,$ q等)时,它们提供了我们需要的一些功能.$ scope允许我们观察,应用,使用消息以及数据绑定.即使使用控制器,仍然使用$ scope,它只是抽象 (9认同)
我个人也遵循你的方法使用vm.我接受的唯一代码味道是当你需要专门与$ scope进行交互时,例如订阅或广播事件,访问控制器内部的表单验证变量等.这会导致一个有点混合的环境,你仍然需要注入$ scope即使您使用控制器作为功能. (4认同)
@JohnPapa - 为什么SideWaffle模板不"返回vm;" 何时使用Controller As？ (2认同)
@Kevin控制器有效地充当了Ctor,因此已经返回"this". (2认同)

Answer 2

$scope正在Angular 2.0中删除.因此,this随着Angular 2.0的发布日期越来越近,使用将成为其他人想要遵循的方法.

Answer 3

我的观点是,javascript中的'this'在它自己有足够的问题,并且为它添加另一个意义/用途并不是一个好主意.

为了清晰起见,我会使用$ scope.

UPDATE

现在有'controller as'语法,在这里讨论.我不是粉丝,但现在它是一个更"官方"的AngularJS构造,值得一些关注.

我想我们首先需要了解新的"UserCtrl as uCtrl"语法,然后才能说出我们认为哪个更好. (10认同)
如果您熟悉[oop in JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript),那就非常有意义了.控制器是一个类,而angular每次创建一个控制器时都使用new运算符.欢迎您不喜欢它,但声明使用'this'存在问题是误导性的.这是'this'的可接受用例. (4认同)

Answer 4

我认为Controller As更好,因为它允许更容易嵌套范围,如Todd Motto所述:

此外,它将确保您始终至少有一个.在你的绑定表达式中,它强制你遵循不绑定到基元的推荐.

另外,您可以从2.0中消失的范围中分离出来.

Answer 5

Angular文档明确告诉您this建议使用.除了$scope被删除的事实之外,这是我永远不会使用的充分理由$scope.