Question

我有一个Angular应用程序，它有三个不同的业务对象，需要独立地在所有这些对象上实现CRUD操作。我们称他们为a，b，c。我有等效的aCtrl，bCtrl，cCtrl和aSvc，bSvc，cSvc来管理这些CRUD操作。所以在这个例子中，aCtrl管理'a'的CRUD。 aSvc通过ajax调用帮助将数据保存到后端。我还有一个allCtrl和allSvc，当应用程序第一次加载时，它会从一个json对象的后端将所有对象a，b，c拉到一起（而不是单独拉动它们，我设计了后端来推送一个统一的json对象嵌入了a，b，c。

'all'对象

{
 a:{},
 b:{},
 c:{}
}

所以我坚持用简单有意义的方式构建应用程序。当应用程序第一次加载时，我将从后端通过allSvc拉入“all”对象。这具有执行CRUD所需的所有数据（当然，我必须使其与后端保持同步）。当应用程序第一次加载时，我想列出“a”类型的对象，然后为用户提供编辑/删除/添加选项。同样，我有一个下拉导航，将用户带到其他页面，这些页面对象'b'，'c'完全相同。

以下是我到目前为止所做的一些片段以及我如何悲惨地失败：）

的index.html

<html lang="en" ng-app="myApp">
 ...
 ...
 <div class="" ng-view></div>

JS

var myApp = angular.module('myApp', ['ngRoute','restangular']);  
myApp.controller('aCtrl', function($scope, aSvc) 
myApp.controller('bCtrl', function($scope, bSvc) 
myApp.controller('cCtrl', function($scope, cSvc) 
myApp.controller('allCtrl', function($scope, allSvc)

路由

myApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/a/list', {templateUrl: 'partials/a/list.html',controller: 'aCtrl'});
$routeProvider.when('/a/add', {templateUrl: 'partials/a/add.html', controller: 'aCtrl'});
$routeProvider.when('/a/edit/:id', {templateUrl: 'partials/a/edit.html', controller: 'aCtrl'});
$routeProvider.when('/a/delete/:id', {templateUrl: 'partials/a/list.html', controller: 'aCtrl'});
.... similary I have routes for b & c to perform crud
$routeProvider.otherwise({redirectTo: '/a/list'});

}]);

aCtrl

myApp.controller('aCtrl', function($scope, aSvc,allSvc) {
$scope.allCollection= allService.getAll();
$scope.aCollection = allCollection.a;

我无法在此设计中有意义地设置routeParams以正确执行编辑/删除。我还必须考虑userId（登录的用户需要执行CRUD操作）。如何更好地管理路线？我应该使用/ a / edit / userId / aId来编辑'a'和/ a / delete / userId / aId来删除'a'作为例子吗？

请帮我擦亮这个粪便。

Answer 1

我已在控制器中分离了服务/更新/请求调用，并且可以在以下路径中找到该项目。如果有人认为可以进一步改进，请告诉我。但是，为了测试服务，我使用了strongloop，可以在存储库本身找到描述。

Angular - Create, Update, Delete

样本看起来像这样：

'use strict';

function MainController($scope, $state, $rootScope, $window, $stateParams, HttpService) {


  $scope.init = function () {
    HttpService.load("http://0.0.0.0:3000/api/custdetails")
      .then(function (response) {
        if (response) {
          console.log(JSON.stringify(response.data));
          $scope.showAllData = response.data;
        }
      }, function (error) {
        console.log("Error occurred");
      });
  };

  $scope.addMoreData = function () {
    var data = {
      cust_name: $scope.custNameModel,
      phone_number: $scope.phoneNumberModel,
      id: $scope.idModel
    };

    HttpService.update('http://0.0.0.0:3000/api/custdetails?', data);
    $scope.init();

  };

  $scope.updateData = function () {
    var data = {
      cust_name: $scope.custNameModel,
      phone_number: $scope.phoneNumberModel,
      id: $scope.idModel
    };

    HttpService.patch('http://0.0.0.0:3000/api/custdetails?', data);
    $scope.init();

  };

  $scope.deleteData = function () {
    console.log("ID defined is: " + $scope.idModel);
    HttpService.delete("http://0.0.0.0:3000/api/custdetails", $scope.idModel);
    $scope.init();

  };

}

一个应用程序中多个模型对象的角度CRUD

1 个答案: