angularjs: ngModelController не найден в FormController

Question

angularjs: ngModelController не найден в FormController

0

У меня есть две директивы, одна - моя форма, одна - мое поле.
Все работает хорошо, но я не могу получить ngModelController полей ввода.
Поэтому я не могу получить $ грязные, $ valid свойства этих полей.
Например, при отправке я хочу получить ngModelController ввода с именем "field1", но я не могу его получить.
form.field1 не определено.
В FormController "form1" нет поля, любой может помочь в этом?
Большое спасибо

код в скрипке выглядит следующим образом:
https://jsfiddle.net/luneyq/0td5hLur/2/

основные коды также перечислены ниже:

        angular.module('myApp', [])
                .controller('MyController', ['$scope', function ($scope) {
                    $scope.config = {
                        name: 'form1',
                        fields: [
                            {type: 'text', name: 'field1', model: 'obj.field1'},
                            {type: 'text', name: 'field2', model: 'obj.field2'}
                        ]
                    };
                }])
                .directive('myForm', function() {
                    return {
                        restrict: 'E',
                        replace: true,
                        template: '' +
                            '<form name="{{config.name}}">' +
                            '   <my-field ng-repeat="item in config.fields" config="item"></my-field>' +
                            '    <button ng-click="submit()">submit</button>' +
                            '</form>',
                        scope: {
                            config: '='
                        },
                        link: function(scope, el, attr) {
                            scope.obj = {};
                            scope.submit = function() {
                                var form = scope[scope.config.name];
                                alert(form.field1);
                                alert(form.field1.$dirty);        // error here
                            }
                        }
                    }
                })
                .directive('myField', ['$compile', function($compile) {
                    return {
                        restrict: 'E',
                        replace: true,
                        link: function(scope, iElement, iAttrs) {
                            scope.config = scope.$eval(iAttrs.config);
                            var config = scope.config;
                            var html = '<input type="' + config.type + '" ng-model="' + config.model + '" name="' + config.name + '" />';
                            iElement.after($compile(html)(scope));
                            iElement.remove();
                        }
                    }
                }])
        ;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyController">
    <my-form config="config"></my-form>
</div>

Lune 27 апр. 2016, в 04:42

Источник

0

кто-нибудь может помочь в этом ???
Lune 03 май 2016, в 02:50

Теги:

angularjs

directive

2 ответа

1

Попробуй это:

    angular.module('myApp', [])
            .controller('MyController', ['$scope', function ($scope) {
                $scope.config = {
                    name: 'form1',
                    fields: [
                        {type: 'text', name: 'field1', model: ''},
                        {type: 'text', name: 'field2', model: ''}
                    ]
                };
            }])
            .directive('myForm', function() {
                return {
                    restrict: 'E',
                    replace: true,
                    template: '' +
                        '<form name="{{config.name}}">' +
                        '   <my-field ng-repeat="item in config.fields" field="item"></my-field>' +
                        '    <button ng-click="submit()">submit</button>' +
                        '</form>',
                    scope: {
                        config: '='
                    },
                    link: function(scope, el, attr) {
                        scope.submit = function() {
                                var form = scope[scope.config.name];
                                angular.forEach(scope.config.fields, function(item){
                                    console.log(item.name + ": " + form[item.name].$dirty);
                            });                                
                        }
                    }
                }
            })
            .directive('myField', function() {
                return {
                    restrict: 'E',
                    replace: true,
                    template: '' +
                        '<input type="{{field.type}}" ng-model="field.model" name=" {{field.name}}" />',
                    scope: {
                        field: '='
                    }                        
                }
            })
    ;

Raphael Torres 26 апр. 2016, в 23:39

0

да, ваш код работает, но не могли бы вы объяснить, почему мой код не сработал? На самом деле, мой код является только упрощенной версией реального, мне нужно использовать режим синтаксического анализа строки, потому что в реальном мире существуют разные типы полей.
Lune 27 апр. 2016, в 05:01
0

Между тем, в вашем коде ng-модель каждого поля одинакова.
Lune 27 апр. 2016, в 05:33

Ещё вопросы

да, ваш код работает, но не могли бы вы объяснить, почему мой код не сработал? На самом деле, мой код является только упрощенной версией реального, мне нужно использовать режим синтаксического анализа строки, потому что в реальном мире существуют разные типы полей.
Между тем, в вашем коде ng-модель каждого поля одинакова.

Lune · Accepted Answer · 2016-05-10T03-54-00.000Z

Я попробовал это самостоятельно, только изменил несколько строк, но это была действительно нелегкая работа.
Пожалуйста, обратитесь к другому сообщению:

Пользовательская форма angularjs и полевая директива: ngModelController не найден в FormController, введите описание ссылки здесь