Разница между этим и объемом в контроллере

Я новичок в angularjs. В чем разница, если вы назначаете функцию $scope или этим ключевым словам в контроллере? Спасибо.

Пример (область):

.controller('TestCtrl', ['$scope', function ($scope) {
    $scope.testFunc = function () {
    };
}]);

Пример (это)

.controller('TestCtrl', [function () {
    var app = this;
    app.testFunc = function () {
    };
}]);

Ответ 1

$scope является основной концепцией структуры angular и двух функциональных функций привязки данных. Например, он предназначен для совместного использования своего контента:

Шаблоны
директивы
и т.д.

В шаблоне, например, вам нужно привязать функцию к scope для доступа к ней. Вы не сможете напрямую вызвать функцию, привязанную к this.

Изменить: Благодарим сообщение BKM, в котором указано, что это поведение возможно с помощью синтаксиса "контроллер как", который напрямую связывает ваш шаблон к контроллеру. Но решать вам, хотите ли вы разрешить доступ ко всем объектам/переменным вашего контроллера в своем шаблоне вместо выделенного viewModel (scope). За и против, см.: https://groups.google.com/forum/#!topic/angular/84selECbp1I

Это важная концепция angular, которую вам нужно понять.

Смотрите:

http://docs.angularjs.org/guide/scope для введения
https://github.com/angular/angular.js/wiki/Understanding-Scopes для получения дополнительной технической информации о областях

this keywork ссылается только на javascript object, ссылаясь на ваш controller, не более того.

Ответ 2

Что сказал Бикси, было неправильно. Нет необходимости связывать функцию с областью доступа, чтобы получить доступ к ней.

В новейшей версии Angular JS i.e, 1.2 они вводят новое ключевое слово controllerAs, чтобы можно было не иметь область видимости внутри контроллера.

<div ng-controller="testCtrl as test">
    {{test.value}}
</div>

И в вашем контроллере

app.controller('testCtrl ', function () {
   this.value = 'Hello World';
});

См. приведенный выше контроллер, сгенерированный без ввода $scope.

Здесь - хороший видеоурок, объясняющий это.

Ответ 3

Ниже приведены различия между ними.

Синтаксис CONTROLLER AS является новым и официально выпущен в 1.2.0. $scope является старой техникой и доступна, так как выпущена начальная версия angular.
Вы можете использовать любой из методов. Оба имеют свое собственное использование. Например, синтаксис CONTROLLER AS делает ваш код более читабельным при работе с вложенными областями. Мы обсуждали это в нашем предыдущем видео.
Если вы хотите использовать $scope, его необходимо внедрить в функцию контроллера, тогда как с синтаксисом CONTROLLER AS такая инъекция не требуется, если она вам не нужна для чего-то другого.

Какой из них использовать, зависит от ваших личных предпочтений. Некоторые предпочитают использовать $scope, в то время как другие предпочитают использовать синтаксис CONTROLLER AS. Следует помнить одну важную вещь: хотя вы используете синтаксис CONTROLLER AS, за кулисами по-прежнему используется $scope. Angular берет экземпляр контроллера и добавляет его в качестве ссылки на область видимости.

<div ng-controller="cityController as cityCtrl">
    {{cityCtrl.name}}
</div>

В приведенном выше примере, поскольку мы используем синтаксис CONTROLLER AS, angular берет cityCtrl, который является экземпляром cityController, и добавляет его в качестве ссылки на область действия. Таким образом, в выражении привязки вы можете прочитать его как $scope.cityCtrl.name.