未呈现的表单部分 - AngularJS

时间:2015-04-06 15:38:54

标签: javascript html angularjs forms

我似乎无法找到为什么我的表单的“开始”和“完成”部分没有呈现。这是我第一次使用AngularJS,并且经过网上的不少讨论后,我常常使用文章示例来表达你的意思。然后,我接受了文章示例,并尝试将其移植到此调度事件中。但这并不重要,我只是想知道为什么表单中的最后两个输入没有在我的视图中呈现。

非常感谢任何帮助

以下是我的观点代码:

<section data-ng-controller="SchedulesController">
    <div class="page-header">
        <h1>New Schedule</h1>
    </div>
    <div class="col-md-12">
        <form name="scheduleForm" class="form-horizontal" data-ng-submit="create()" novalidate>
            <fieldset>
                <div class="form-group" ng-class="{ "has-error": scheduleForm.title.$dirty && scheduleForm.title.$invalid }">
                    <label class="control-label" for="title">Title</label>
                    <div class="controls">
                        <input name="title" type="text" data-ng-model="title" id="title" class="form-control" placeholder="Title" required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label" for="content">Content</label>
                    <div class="controls">
                        <textarea name="content" data-ng-model="content" id="content" class="form-control" cols="30" rows="10" placeholder="Content"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label" for="start">Start</label>
                    <div class="controls">
                        <input name="finish" value="" type="date" data-ng-model="start" class="form-control" required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label" for="finish">Finish</label>
                    <div class="controls">
                        <input name="finish" value ="" type="date" data-ng-model="finish", class="form-control" required>
                    </div>
                </div>
                <div class="form-group">
                    <input type="submit" class="btn btn-default">
                </div>
                <div data-ng-show="error" class="text-danger">
                    <strong data-ng-bind="error"></strong>
                </div>
            </fieldset>
        </form>
    </div>
</section> 

这是我的控制器的代码:

'use strict';

angular.module('schedules').controller('SchedulesController', ['$scope', '$stateParams', '$location', 'Authentication', 'Schedules',
    function($scope, $stateParams, $location, Authentication, Schedules) {
        $scope.authentication = Authentication;

        $scope.create = function() {
            var schedule = new Schedules({
                title: this.title,
                content: this.content,
                start: this.start,
                finish: this.finish
            });
            schedule.$save(function(response) {
                $location.path('schedules/' + response._id);
                console.log('hola!');
                $scope.title = '';
                $scope.content = '';
            }, function(errorResponse) {
                $scope.error = errorResponse.data.message;
            });
        };

        $scope.remove = function(schedule) {
            if (schedule) {
                schedule.$remove();

                for (var i in $scope.schedules) {
                    if ($scope.schedules[i] === schedule) {
                        $scope.schedules.splice(i, 1);
                    }
                }
            } else {
                $scope.schedule.$remove(function() {
                    $location.path('schedules');
                });
            }
        };

        $scope.update = function() {
            var schedule = $scope.schedule;

            schedule.$update(function() {
                $location.path('schedules/' + schedule._id);
            }, function(errorResponse) {
                $scope.error = errorResponse.data.message;
            });
        };

        $scope.find = function() {
            $scope.schedules = Schedules.query();
        };

        $scope.findOne = function() {
            $scope.schedule = Schedules.get({
                scheduleId: $stateParams.scheduleId
            });
        };
    }
]);

1 个答案:

答案 0 :(得分:0)

嗯......嗯......好吧......我不知道为什么会这样,我身上的一切都告诉我这不是问题,但是:

通知行 <input name="finish" value ="" type="date" data-ng-model="finish", class="form-control" required>

“,”是一个错误(我编写了一个脚本,将文章中的所有内容移植到日程表中,维护代码结构,只更改了[Aa] rticle {s} - &gt; [Ss] chedule {s}的所有提及,这就是遗留下来的(出于某种原因,不知道它在哪里)。无论如何,我删除了评论并运行了grunt build && grunt test && grunt并且它运行了。我现在正在获得正确的渲染。