Question

我有一个表单，显示由angular填充的约会信息。当我将现有约会加载到表单中时，一切都很有效，但是当我尝试创建新约会时，我得到一堆空引用错误，并且没有现有数据用于填充字段。

例如，这是我的一个观点的片段：

<fieldset class="form-inline extra-padding-right">
    <legend class="sr-only">Event Information</legend>
    <div class="form-group">
        <label>ID:</label>
        <p class="form-control-static">{{ eventId }}</p>
    </div>
    <div class="form-group">
        <label>Title:</label>
        <p class="form-control-static">{{ eventTitle }}</p>
    </div>
    <div class="form-group">
        <label>Event Status:</label>
        <select class="form-control" id="ddlEventStatus" ng-model="eventStatus"
                ng-options="es as es.EventStatusName for es in eventStatusList track by es.EventStatusId">
        </select>
    </div>
</fieldset>

eventId，eventTitle和eventStatus附加到控制器中的$scope，并且全部为空，因为这将是一个新约会。

我是否必须创建单独的html视图以创建新约会并加载现有约会，或者是否有某种方法可以在我的视图中放置条件，因此它只会在加载现有约会时尝试填充字段？

Answer 1

经常可以使用相同的控制器和视图进行编辑/创建，只需在范围内切换标志变量：

类似的东西：

$scope.editMode = 'create';
$scope.startEdit = function(event){
   $scope.editMode = 'edit';
   $scope.event = event;
}
$scope.saveEdit = function(){

   $http.post(url,$scope.event).then(function(resp) {
       $scope.editMode = 'create';
       $scope.event = {}; // reset event object
   });
}

由于您应始终始终使用ng-model中的对象，因此您的视图应使用更多类似的输出：

<span>{{ editMode == 'create' ? "New Event" : "Edit Event"}}</span>
{{ event.id }}
<input ng-model="event.id">

我是否需要单独的视图来创建新数据和加载现有数据？

1 个答案: