Действительно ли нет разницы между AngularJS $scope и Controller как синтаксисом?

Я изучаю angularJS и во время обучения обнаружил, что синтаксис контроллера намного легче читать, и мне немного легче понять его из мира OO. Я прочитал несколько статей и ответов SO, которые, похоже, указывают на то, что $scope и синтаксис «контроллер как» одинаковы, и что синтаксис «контроллер как» - это просто синтаксический сахар.

Однако я разместил еще один вопрос на SO здесь , и пользователь, ответивший на вопрос, говорит, что мне все еще нужно вводить $scope, чтобы использовать директивы 'ui select', даже если я использую контроллер в качестве синтаксиса. Что он? И если мне не нужно использовать $scope, чего мне не хватает, чтобы заставить синтаксис «контроллер как» работать с ui-select?


javascript angularjs angularjs-ng-repeat angularjs-scope angularjs-controlleras
person gcoleman0828    schedule 09.02.2016    source источник
comment
Я написал довольно подробный ответ на эту тему здесь: stackoverflow.com/a/30644370/2495283. Я не буду пытаться ответить снова, но я надеюсь, что ответ даст вам хороший контекст.   -  person Claies    schedule 09.02.2016

Ответы (3)


arrow_upward
1
arrow_downward

Синтаксис controllerAs предоставляет вашему контроллеру доступ к шаблону, поэтому вместо того, чтобы привязывать кучу свойств к $scope в вашем контроллере, вы можете сделать их свойствами экземпляра вашего контроллера. (Контроллеры — это конструкторы «классов» JavaScript.)

Итак, если у вас есть следующее:

angular.module('myApp')
  .controlller('MyController', function() {
    var vm = this;
    vm.foo = 'bar';
  });

... вы можете получить к нему доступ в своем шаблоне следующим образом:

<div ng-controller="MyController as vm">
  {{ vm.foo }}
</div>

Теперь, если вы хотите получить доступ к переменным области видимости в вашем контроллере или вызвать метод области видимости, такой как $on, вам все равно нужно внедрить $scope в ваш контроллер. Обратите внимание на $ перед областью действия, которая указывает на то, что это служба. Эта служба $scope просто предоставляет текущую область действия.

Все это говорит о том, что если вы обнаружите, что вводите $scope в свой контроллер, вам следует подвергнуть сомнению свой подход. Лучше создать пользовательскую директиву и область доступа через функцию ссылки или область доступа из шаблона.

Рекомендуемое чтение: http://www.johnpapa.net/do-you-like-your-angular-controllers-with-or-without-sugar/

person Shaun Scovil    schedule 09.02.2016

arrow_upward
2
arrow_downward

Извините, что длинно без примеров.

Контроллер в обеих формах Controller и Controller As являются функциями. Основное отличие от моего понимания заключается в том, что Controller As при вызове вызывается с использованием ключевого слова new, поэтому синтаксис «this» работает. По этой же причине вы можете выполнить наследование прототипа с помощью синтаксиса Controller As, в то время как вы не можете сделать это с помощью обычного синтаксиса Controller. Другая интересная часть контроллера. Что касается пространства имен, вы можете поместить переменные области видимости, что означает, что в HTML легко понять, какие части относятся к какому контроллеру. Если хотите, я могу привести примеры, но это основное отличие от моего понимания.

person Michael Warner    schedule 09.02.2016

arrow_upward
1
arrow_downward

контроллер, как это хорошо, потому что вы можете вкладывать ng-контроллеры и знать, на каком контроллере вы действуете

<div ng-controller="Ctrl1 as c1">
  <--Using c1 here -->
  <div ng-controller="Ctrl2 as c2">
  <-- Using c2 here -->
  </div>
  <--Using c1 here -->
</div>
person Scott Schwalbe    schedule 09.02.2016