繁体   English   中英

使用带ng-options的ng-model和带AngularJS的Restangular

[英]Using ng-model with ng-options and Restangular with AngularJS

我在将select元素的选项列表中的项目设置为选中时遇到问题。 我的服务器后端是Django 1.5,其中TastyPie作为API。

模板(简化)

<select
    ng-model='dataService.major_minor.department'
    ng-options='d.name for d in dataService.departments'
    name='department'
    class='select2'
    required>
</select>

数据服务

majorMinor.factory('dataService', function($rootScope, Restangular) {
    var self = {};

    self.degrees = [];
    self.departments = [];
    self.major_minor = false;
    self.majors_and_minors = [];

    self.fetch_degrees = function() {
        Restangular.all('degree').getList().then(function(results) {
            self.degrees = results;
        });
    };

    self.fetch_departments = function() {
        Restangular.all('department').getList().then(function(results) {
            self.departments = results;
        });
    };

    self.fetch_major_minor = function(majorMinorID) {
        Restangular.one('major-minor', majorMinorID).get().then(function(result) {
            self.major_minor = result;
        });
    };

    self.fetch_major_minor_list = function() {
        Restangular.all('major-minor').getList().then(function(results) {
            self.majors_and_minors = results;
        });
    };

    self.fetch_degrees();
    self.fetch_departments();
    self.fetch_major_minor_list();

    return self;
});

控制器

majorMinor.controller('EditCtrl',
    function($scope, $routeParams, dataService) {

        $scope.dataService = dataService;
        $scope.dataService.major_minor = false;
        $scope.dataService.fetch_major_minor($routeParams.majorMinorID);
    }
);

我正在努力解决的问题是major_minor.department是一个外键。 TastyPie正在返回一个完整的对象,因此它不仅仅是部门URI。 dataService.departments数组是此用户可用的所有部门的数组。 如果你要将major_minor.department与dataService.departments [indexOfDepartment]进行比较,它们将是相同的。

有什么想法为什么ng-model没有正确选择ng-option? 我对Angular / Restangular的理解可能存在差距,因为这只是我使用两者的第二个项目。

杰克,我遇到了类似的问题,并通过调整ng-options来解决它

<select
    ng-model='dataService.major_minor.department.id'
    ng-options='d.id as d.name for d in dataService.departments'
    name='department'
    class='select2'
    required>
</select>

然后我更改了我的角度服务,在我发布到我的快速ReSTful服务之前,将dataservice.major_minor.department从一个对象更改为ID。 这应该给你在有效载荷中穿过电线的外键,而不是非规范化的对象。 这是一个coffeescript服务,所以与你正在采取的工厂方法有点不同。

   save: (major_minor) ->
      major_minor.department = major_minor.department?._id
      @$http.post("/api/major_minor/", major_minor)

angularjs文档在这里的ng-options部分讨论了这个: https ://docs.angularjs.org/api/ng/directive/select

希望有所帮助,尤其是遇到此问题的未来搜索者。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM