创建新数据和加载现有数据需要单独的视图吗

Do I need separate views for creating new data and loading existing data?

本文关键字：数据 单独 视图 加载 新数据 创建      更新时间：2023-09-26

我有一个表格，显示按角度填充的约会信息。当我将现有约会加载到表单中时，一切都很好，但当我尝试创建新约会时，我会遇到一堆空引用错误，并且没有现有的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视图来创建新的约会和加载现有的约会吗？或者有没有办法在我的视图中放置条件词，这样它只会在加载现有约会时尝试填充字段？

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

类似于：

$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">
相关文章：