Форма не определена в области видимости в AngularJS - PullRequest
Новая
       18

Форма не определена в области видимости в AngularJS

0 голосов
/ 03 января 2019

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

main.js (MainController):

    $stateProvider
    .state('page1', {
        url : '/',
        templateUrl : 'page1.html',
        controller : "Page1Controller"
    })
    .state('page2', {
        url : '/',
        templateUrl : 'page2.html',
        controller : "Page2Controller"
    });`

На странице 2 у меня есть форма 

<div class="outer" ng-controller="MainController">
    <div class="page" ng-init="test();">
        <form id="page2_form" name="page2_form"> 
            <input type="text" id="field1" name="field1"/>
            <input type="text" id="field2" name="field2"/>
        </form>
    </div>
</div>

Я буду использовать область для проверки формы на предмет проверки, но в настоящее время она не определена. Я проверяю это с помощью $scope.$watch. 

page2.js (Page2Controller):

    $scope.$watch('page2_form', function(page2_form) {
        console.log(page2_form);
    });

Но это распечатка "undefined". Я предполагаю, что маршрутизация фактически загружается в контроллер, так как работает ng-init. Тем не менее, это работает, если я пытаюсь добавить ng-controller="Page2Controller" к <div class="page">, это выводит форму в $ scope. $ Watch, что мне и нужно, но он запускается дважды, так как контроллер загружается дважды.

Почему он не выводит форму, даже если контроллер загружается при маршрутизации?

UPDATE

Мое исправление:

Добавление $scope.form = {}; к page2.js (Page2Controller) и изменение формы на это: 

<form id="form.page2_form" name="form.page2_form"></form>

Это означает, что теперь я могу получить доступ к полям в форме с помощью 

$scope.form.page2_form[fieldname]

Однако я не уверен, почему я должен делать это сейчас, так как у меня есть прошлые приложения, где мне не нужно было выполнять аспект form.form_name.

1 Ответ

0 голосов
/ 03 января 2019

Я думаю, что ваша проблема связана с наследованием JavaScript ProtoTypal и тем, как Angular.js обрабатывает это в директивах 'ng- *'. Пожалуйста, проверьте эту ссылку для более глубокого понимания этой темы. https://github.com/angular/angular.js/wiki/Understanding-Scopes

...