angularjs – 如何使用ngResource处理3级深层嵌套资源?

我正在研究我的第一个AngularJS应用程序,以便学习该框架.

我目前正在寻找一种能够处理嵌套资源的惯用方法.

我的区域包含有公寓的建筑物.一个单位只在一个建筑物内,只在一个区域内转入.

在我的数据库模型中,我不需要将区域Id与平面对象一起存储,其父级(建筑物ID)就足够了.

下面是我写的一个最小例子来说明这个概念.我根据我在Google I / O的视频中看到的内容http://www.youtube.com/watch?v=HCR7i5F5L8c

我的问题是:如何实例化特定的Flat资源?我拥有URL中所需的所有信息,但它并不严格对应我的模型(缺少区域ID).

var app = angular.module('neighborhoodApp',[
  'ngResource','ngRoute'
]);

angular.module('neighborhoodApp')
  .factory('Area',function ($resource) {
    return $resource('/areas/:id',{
      'id': '@_id'
    });
  });

angular.module('neighborhoodApp')
  .factory('Building',function ($resource) {
    return $resource('/areas/:aid/buildings/:id',{
      'id': '@_id','aid': '@area_id'
    });
  });

angular.module('neighborhoodApp')
  .factory('Flat',function ($resource) {
    return $resource('/areas/:aid/buildings/:id/flats/:id','bid': '@building_id'
      // 'aid': '@area_id' => my model doesn't have an area id,having a building id attached to a flat is enough to find the area
    });
  });

angular.module('neighborhoodApp')
  .controller('AreaListCtrl',function (Area) {
    this.areas = Area.query();
  });

angular.module('neighborhoodApp')
  .controller('AreaShowCtrl',function ($routeParams,Area) {
    this.area = Area.get({
      id: $routeParams.aid
    });
  });

angular.module('neighborhoodApp')
  .controller('BuildingListCtrl',function (Building) {
    this.buildings = Building.query();
  });

angular.module('neighborhoodApp')
  .controller('BuildingShowCtrl',Building) {
    this.building = Building.get({
      aid: $routeParams.aid,id: $routeParams.rid
    });
  });

angular.module('neighborhoodApp')
  .controller('FlatShowCtrl',function (Flat) {
    this.flats = Flat.query();
  });

// What is the idiomatic way to pass the area id (from $routeParams.aid)
// so that the server can be queried successfully
angular.module('neighborhoodApp')
  .controller('FlatListCtrl',Flat) {
    this.flat = Flat.get({
      bid: $routeParams.bid,id: $routeParams.rid
    });
  });

app.config(function ($routeProvider) {
  $routeProvider
    .when('/areas',{
      templateUrl: 'views/area/list.html',controller: 'AreaListCtrl',controllerAs: 'list'
    })
    .when('/areas/:aid',{
      templateUrl: 'views/area/show.html',controller: 'AreaShowCtrl',controllerAs: 'show'
    })
    .when('/areas/:aid/buildings',{
      templateUrl: 'views/building/list.html',controller: 'BuildingListCtrl',controllerAs: 'list'
    })
    .when('/areas/:aid/buildings/:bid',{
      templateUrl: 'views/building/show.html',controller: 'BuildingShowCtrl',controllerAs: 'show'
    })
    .when('/areas/:aid/buildings/:bid/flats',{
      templateUrl: 'views/flat/list.html',controller: 'FlatShowCtrl',controllerAs: 'list'
    })
    .when('/areas/:aid/buildings/:bid/flats/:fid',{
      templateUrl: 'views/flat/show.html',controller: 'FlatListCtrl',controllerAs: 'show'
    })
    .otherwise({
      redirectTo: '/areas'
    });
});

解决方法

我不认为你需要areaId,当检索一个公寓时,你需要的只是flatId.

但是,在保存新单元时,您可以将buildingId添加为单元的详细信息(在模型中)

.factory('Flat',function ($resource) {
    return $resource('/flats/:id',{

但是当你查询单位时,例如1区的所有公寓

Flat.query({aid=1})

这将转化为

www.yourapp.com/flat?aid=1

您不必将其添加到模型中,因为它不是模型的一部分.

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...