Я новичок в AngularJs, но теперь я немного поняла, как работает AngularJs.
Я хочу спросить о нескольких строках в документации по директиве ngModel.

Вот эти строки:

Примечание. NgModel попытается выполнить привязку к заданному свойству, оценив выражение в текущей области. Если свойство еще не существует в этой области, оно будет неявно создано и добавлено в область.

Я не понимаю, что они пытаются сказать. Я знаю, что директива ngModel связывает свойство с элементами управления input, select и textarea. Как и очень простой код ниже:

Name: <input type="text" ng-model="myName">
{{myName}}

Итак, может ли кто-нибудь привести какой-нибудь другой точный пример, который поможет мне понять эти строки?

1
Rohaan 3 Сен 2014 в 12:16

3 ответа

Лучший ответ

ngModel - это стандартный способ привязки Angular свойства области (обычно объявленной в контроллере) к пользовательскому интерфейсу.

Итак, обычно создается контроллер со свойством, объявленным внутри:

angular.controller('Ctrl', function($scope) {

    $scope.myProperty = '';

}); 

И вы должны привязать его к пользовательскому интерфейсу следующим образом:

<div ng-controller="Ctrl">
    <input type="text" ng-model="myProperty"/>
</div>

В этом примере $scope ограничен в пользовательском интерфейсе элементом div, поскольку атрибут ng-controller связывает Ctrl с этим элементом.

Однако Angular также позволяет вам быть немного ленивым и не беспокоиться об определении myProperty в контроллере:

angular.controller('Ctrl', function($scope) {

}); 

И по-прежнему использую его в пользовательском интерфейсе:

<div ng-controller="Ctrl">
    <input type="text" ng-model="myProperty"/>
</div>

В этом случае Angular неявно (динамически) создаст myProperty на $scope. Это можно использовать в пользовательском интерфейсе внутри области действия ng-controller.

Это можно использовать для свойств UI only , о которых вы не хотите беспокоить контроллер. Примером может быть ситуация, когда вы хотите что-то скрыть / показать на основе взаимодействия с пользователем.

Надеюсь это поможет.

2
Davin Tryon 3 Сен 2014 в 09:00

У вас есть контроллер с $scope.
Вы можете инициализировать свою $ scope значениями (например):

$scope.myName= 'test';

И тогда введенное вами значение будет иметь значение по умолчанию test.

Name: <input type="text" ng-model="myName">
{{myName}}

Вы можете не запускать свою область действия со значением, и тогда $scope.myName будет создан за кулисами и привязан без значения по умолчанию.

1
Nope 3 Сен 2014 в 08:31

Давайте разберем это:

Note: ngModel will try to bind to the property given by evaluating the expression
on the current scope. If the property doesn't already exist on this scope, it
will be created implicitly and added to the scope.

1) ngModel попытается выполнить привязку к заданному свойству, оценив выражение в текущей области.

Итак, если у вас есть элемент:

<input ng-model="theProperty">

У этого элемента будет область действия:

var theScope = element.scope()

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

 will try to bind to the property given... on the current scope.

Обратите внимание, что там написано « попробуйте », потому что возможно, что текущая область содержит свойство или нет. Потому что angular будет делать что-то вроде этого:

 theScope['theProperty'] = the_inputs_value;

Когда свойство не существует, оно создается. Это объясняет следующее утверждение.

 If the property doesn't already exist on this scope, 
 it will be created implicitly and added to the scope.
0
Noypi Gilas 3 Сен 2014 в 08:39