1

我是 Angular 的新手,我正在根据以下样板构建我的第一个实时页面:

https://github.com/jimakker/angular-express-bootstrap-seed

我无法让我的第一个表单提交。事实上,当我单击按钮时,什么也没有发生。下面给出了代码中的相关片段:

局部视图:

.row
form(ng-controller='RegisterCtrl')
    #accordion.panel-group
           //- Panel 1
           .panel.panel-default
            .panel-heading
                h4(class='panel-title')
                    a(data-target='#collapse1', data-toggle="collapse", data-parent="#accordion", class="left-m-1em cursor-pointer") Basic Information
            #collapse1.panel-collapse.collapse
                .panel-body
                    .row
                        .col-lg-2(ng-controller='DropdownCtrl')
                            select(id="gender", ng-model='register.gender', ng-init="getValues('gender')", ng-options='r.value for r in results track by r.key', chosen, class="form-control", data-placeholder="Gender", data-toggle="tooltip", data-trigger="hover", data-placement="top", title="Gender")
                                option(value="") 

//- More panels in between and finally, Panel 6
           .panel.panel-default
            .panel-heading
                h4(class='panel-title')
                    a(data-target='#collapse6', data-toggle="collapse", data-parent="#accordion", class="left-m-1em cursor-pointer") Family
            #collapse6.panel-collapse.collapse
                .panel-body
                    .row
                        .col-lg-3.col-lg-offset-5
                            button(type="button", class="btn btn-success btn-lg", ng-click="saveProfile")
                                span(class="glyphicon glyphicon-ok-circle") 
                                | Submit

我查看了呈现的输出并确认提交按钮确实在表单标记内。

控制器:

function RegisterCtrl($scope, $http) {
$scope.register = {};
$scope.saveProfile = function(item, event) {
    alert("called this!");
    var json = {
        gender: $scope.register.gender,
        marital_status: $scope.register.marital_status,
        dob: $scope.register.dob,
        height: $scope.register.height,
        weight: $scope.register.weight,
        complexion: $scope.register.complexion,
        health: $scope.register.health
    };

    var responsePromise = $http.post("/api/register", json, {});
    responsePromise.success(function(dataFromServer, status, headers, config) {
        console.log(dataFromServer.title);
    });
    responsePromise.error(function(data, status, headers, config) {
        alert("Submitting form failed!");
    });

};
}
RegisterCtrl.$inject = ['$scope', '$http'];

我什至没有打第一个警报声明,我完全不确定为什么。另一个控制器 DropdownCtrl(用于单个表单元素)工作得很好,我可以使用控制器动态填充值。请帮我找到丢失的部分。

4

2 回答 2

1

语法是ng-click="saveProfile()"而不是ng-click="saveProfile"

另请注意,这不会将任何参数传递给函数,如果你想这样做,那么你也需要在标记中传递它们。

于 2014-08-18T08:38:03.757 回答
0

发现了问题。控制器文件中有一些杂散代码,内容如下:

` 函数 MyCtrl2() { } MyCtrl2.$inject = [];

 function RegisterCtrl() {
 }
 RegisterCtrl.inject = [];`

而且由于这是在实际定义之后的文件中,所以它弄乱了功能。

于 2014-08-19T02:44:25.140 回答