angularjs - Angular Material 模态的正式问题

Question

我想使用角度材质在模态中显示表单，但只是忽略了控制器。

在模态之外，它运行正常，只有模态给出这个问题..

我做错了什么？

有什么想法吗？

angular.module('adminApp.forms', ['formly', 'formlyBootstrap', 'adminApp.services'], function config(formlyConfigProvider) {

    formlyConfigProvider.setType({
        name        : 'repeatSection',
        templateUrl : 'repeatSection.html',
        controller  : function($scope) {
            $scope.formOptions = {formState: $scope.formState};
            $scope.addNew = addNew;
            $scope.copyFields = copyFields;

            function copyFields(fields) {
                return angular.copy(fields);
            }

            function addNew() {
                $scope.model[$scope.options.key] = $scope.model[$scope.options.key] || [];
                var repeatsection = $scope.model[$scope.options.key];
                var lastSection = repeatsection[repeatsection.length - 1];
                var newsection = {};
                // if (lastSection) {
                //     newsection = angular.copy(lastSection);
                // }
                repeatsection.push(newsection);
            }
        }
    });

})

.controller('FormsController', function($scope, $mdDialog){

    $scope.addField = function(ev){

        $mdDialog.show({
            parent              : angular.element(document.body),
            controller          : FormsBuilder,
            ariaLabel           : 'Adicionar Campo',
            targetEvent         : ev,
            clickOutsideToClose : true,
            templateUrl         : 'partials/tpl/fields.html',
        })

        function FormsBuilder($scope, FIELDS) {

            console.log('start!')

            var vm = this;

            // funcation assignment
            vm.onSubmit = onSubmit;

            init();

            //vm.originalFields = angular.copy(vm.fields);

            // function definition
            function onSubmit() {
                console.log('submit!');
                return

                $scope.field = new FIELDS(vm.model);

                $scope.field.$save(function(){
                    $scope.showToast('Field Group ....Criado!');
                });

            }

            function init() {

                console.log('init!')

                vm.model = {
                    fields: []
                };

                vm.fields = [
                    {
                        "key": "fieldGroup-name",
                        "type": "input",
                        "templateOptions": {
                            "placeholder": "Nome do Grupo",
                            "label": "One add-on on the left (icon)"
                        }
                    },
                    {
                        type: 'repeatSection',
                        key: 'fields',
                        templateOptions: {
                            btnText:'Adicionar novo campo',
                            fields: [
                                {
                                    className: 'row',
                                    fieldGroup: [
                                        {
                                            className: 'col-xs-4',
                                            type: 'input',
                                            key: 'fieldName',
                                            templateOptions: {
                                                label: 'Nome do campo:'
                                            }
                                        },
                                        {
                                            type: 'input',
                                            key: 'fieldSlug',
                                            className: 'col-xs-4',
                                            templateOptions: {
                                                label: 'Slug do campo:'
                                            }
                                        }
                                    ]
                                },
                                {
                                    "type": "select",
                                    "key": "Fieldtype",
                                    "templateOptions": {
                                        "label": "Field Type",
                                        "required": true,
                                        "options": [
                                            {
                                                "name": "Text Field",
                                                "value": "input"
                                            },
                                            {
                                                "name": "TextArea Field",
                                                "value": "textarea"
                                            },
                                            {
                                                "name": "Radio Buttons",
                                                "value": "radio"
                                            },
                                            {
                                                "name": "Checkbox",
                                                "value": "checkbox"
                                            }
                                        ]
                                    }
                                },
                                {
                                    type: 'checkbox',
                                    model: 'formState',
                                    key: 'selfExecuting',
                                    templateOptions: {
                                        label: 'Are you executing this trade?'
                                    }
                                },
                                {
                                    hideExpression: '!formState.selfExecuting',
                                    fieldGroup: [
                                        {
                                            type: 'input',
                                            key: 'relationshipName',
                                            templateOptions: {
                                                label: 'Name:'
                                            }
                                        },
                                        {
                                            type: 'select',
                                            key: 'complianceApprover',
                                            templateOptions: {
                                                label: 'Compliance Approver:',
                                                options: [
                                                    {
                                                        name: 'approver 1',
                                                        value:'some one 1'
                                                    },
                                                    {
                                                        name: 'approver 2',
                                                        value:'some one 2'
                                                    }
                                                ]
                                            }
                                        },
                                        {
                                            type: 'textarea',
                                            key: 'requestorComment',
                                            templateOptions: {
                                                label: 'Requestor Comment',
                                                rows: 4
                                            }
                                        }
                                    ]
                                }
                            ]
                        }
                    }
                ];
            }
        }
    };
});

模态模板：

<md-dialog aria-label="Adicionar Campo">

    <md-dialog-content>

        <h1>Nome do Grupo: {{vm.exampleTitle}}</h1>

        <form ng-submit="vm.onSubmit()" novalidate>

            <formly-form model="vm.model" fields="vm.fields" form="vm.form">
                <md-button type="submit" class="md-raised md-primary">Salvar</md-button>
            </formly-form>

        </form>

    </md-dialog-content>

</md-dialog>  

    <script type="text/ng-template" id="repeatSection.html">
      <div>
        <div class="{{hideRepeat}}">
          <div class="repeatsection" ng-repeat="element in model[options.key]" ng-init="fields = copyFields(to.fields)">
            <formly-form fields="fields" model="element" bind-name="'formly_ng_repeat' + index + $parent.$index">
            </formly-form>
            <div style="margin-bottom:20px;">
              <md-button type="submit" class="md-raised md-primary" ng-click="model[options.key].splice($index, 1)">Remover campo</md-button>
            </div>
            <hr>
        </div>

        <md-button type="button" class="md-raised md-primary" ng-click="addNew()" >{{to.btnText}}</md-button>

      </div>
    </script>

解决：

$mdDialog.show({
            parent              : angular.element(document.body),
            controller          : FormsBuilder,
            controllerAs        : 'vm',   
            ariaLabel           : 'Adicionar Campo',
            targetEvent         : ev,
            clickOutsideToClose : true,
            templateUrl         : 'partials/tpl/fields.html',
        })