Какой смысл имеет новую дочернюю область, недоступную из родительского контроллера? (созданный директивами ng)

В angular.js некоторые директивы создают дочерние области. (ng-include, ng-if и т. д.)

Я знаю, что есть способы решить эту проблему, например, объявив переменную в области видимости контроллера. Просто раскомментируйте //$scope.inner = '1234' и удалить ng-init="inner='1234' и будет работать. Другим решением было бы использование объекта в родительской области, содержащей переменную.

Все еще не имеет смысла для меня.

Какой смысл имеет область без контроллера? Какое практическое применение имеют эти новые дочерние рамки?

Это мой пример.

var app = angular.module('app', []);


app.controller('ctrl', ['$scope', function($scope) {
   $scope.result = "Result";
   $scope.outer = "outer";
   //$scope.inner = "1234";
   $scope.test1 = function() {
       if ($scope.inner) {
            $scope.result = $scope.inner;
       } else {
            alert("inner is not accesible");
       }
   }
    $scope.test2 = function() {
       if ($scope.outer) {
            $scope.result = $scope.outer;
       } else {
            alert("inner2 is not accesible");
       }
   }

}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl" >
<script type="text/ng-template" id="/tpl.html">
    <input type="text" ng-init="inner='Inner'" ng-model="inner"></input>
    <button ng-click="test1()">TEST1</button>
</script>
<div>
 <ng-include src="'/tpl.html'"></ng-include> 
 <br/>
 <input type="text" ng-model="outer"></input>
 <button ng-click="test2()">TEST2</button>
 <p>{{result}}</p>
</div>
</div>

Источник

2 ответа

Решение

Во-первых, вы должны понимать, что области и контроллеры - это две разные концепции.

Область действия - это объект, который ссылается на модель вашего приложения, а контроллер - это функция конструктора, которую вы используете для управления областью действия.

Таким образом, "с точки зрения Angular" вполне приемлемо иметь область действия, которая не дополняется контроллером.

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

Одним из практических примеров использования этих дочерних областей является, например, когда у вас есть два ng-repeat директивы бок о бок, "под" одной и той же области видимости. Если бы они не создавали свои собственные дочерние области, как бы вы имели доступ к $index, $first, $lastи т.д... свойства от каждого из ng-repeat директивы? Без дочерних областей оба будут загрязнять "родительскую" область с одинаковыми свойствами, перекрывая друг друга.

Вы можете прочитать больше информации об областях применения здесь и о контроллерах здесь.

Источник

В частности, для ngInclude это предусмотрено: во многих случаях вы хотите, чтобы включенный контент был изолирован.

Область видимости действительно имеет мало смысла, если не существует js-кода, который работает с ней, но этот код может быть в контроллере или функции связи или (как в случае с ngInclude) функцией postLink.

Также см. Как включить одни частичные в другие, не создавая новую область? который является почти дубликатом и имеет обходной путь.

Источник
Другие вопросы по тегам