使用AngularJS添加/编辑数据的最佳实践

前端之家收集整理的这篇文章主要介绍了使用AngularJS添加/编辑数据的最佳实践前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我目前正在使用AngularJS开发SPA应用程序,该应用程序允许最终用户添加&通过表单编辑订单.

我想知道的是确定应用程序是处于编辑还是创建状态的最佳实践?

例如,当我点击一个名为“添加新订单”的菜单项时,我希望显示一个名为“order.html”的部分视图,其中所有输入字段都是空白的.如果可能的话,我还想在编辑订单时重复使用相同的视图,其中包含从当前正在编辑的订单预先填写的输入字段.

我是否需要使用具有确定状态属性的服务/工厂,例如:

angular.module('app')
    .factory('orderService',['$http',function($http) {
        var state = {
            addOrder: false,order: {
                orderRef: "",orderDate: ""
            }
        };
    }]);

然后我可以根据编辑状态从相关控制器设置addOrder属性,并在addOrder:true时填写order属性和订单的详细信息.

我已经环顾网了,不幸的是,这样的例子似乎很少.

解决方法

我目前正在使用一个服务(DataRepo),它存储您想要全局保存的所有数据.例如,您有一个输入,用户可以输入关于订单的一些附注,如果他们导航回到这个站点,他们可能会再次看到他们的文本.

<input type="text" ng-model="DataRepo.orderNotes">

在控制器中,注入DataRepo服务并将其绑定到范围:

$scope.DataRepo = DataRepo;

通过这样做,用户输入将自动存储到DataRepo服务中.

猜你在找的Angularjs相关文章