javascript - 使用AngularJS在数组中不编辑字符串对象

我完全是AngularJS的新手，只是学习而已。

题

我想在该列表中编辑一个RMA。我按下编辑按钮，然后调用控制器功能updateRma（rma）。按rma数字11后，我的绝对URL为“ http://localhost:8383/RmaClient/app/index.html#/rma-detail/11”


我应该怎么做才能用正确的rma对象数据打开rma-detail.html页面？现在，我总是回到index.html。
$ location.path（'/ rma-detail /'+ rma）;可能是问题所在。如果我取消“ + rma”，我当然可以在没有rma数据的情况下更正rma-detail页面。


我从Java Rest服务那里得到了rmas的列表，如下所示：

<rmas>
<rma>
<an8>22</an8>
<created>2012-02-28T19:28:54+02:00</created>
<dsc1>dsc1</dsc1>
<dsc2>dsc2</dsc2>
<rma>1</rma>
<sarjanro>serial</sarjanro>
<shortdesc>shortdesc</shortdesc>
<tuotenro>tuotenro</tuotenro>
<user>USER</user>
</rma>
</rmas>

作为JSON：

an8: 22,
created: "2012-02-28T19:28:54",
dsc1: "dsc1",
dsc2: "dsc2",
rma: 1,
sarjanro: "serial",
shortdesc: "shortdesc",
tuotenro: "tuotenro",
user: "USER"

视图

<tbody>
        <tr ng-repeat="rma in rmas">
            <td>{{ rma.rma}}</td>
            <td>{{ rma.sarjanro }}</td>
            <td>{{ rma.an8}}</td>
            <td>{{ rma.user }}</td>
            <td>{{ rma.created}}</td>
            <td>{{ rma.tuotenro }}</td>
            <td><a ng-click="updateRma(rma)" class="btn btn-small btn-success">edit</a></td>
            <td><a ng-click="deleteRma(rma.rma)" class="btn btn-small btn-danger">delete</a></td>
        </tr>
    </tbody>

控制器

  angular.module('rmaClientApp')
     .controller('RmaListCtrl', function ($scope, $location, rmaService) {
            $scope.rmas = rmaService.query();
            /* callback for ng-click 'updateRMA': */
            $scope.updateRma = function (rma) {
                $location.path('/rma-detail/'+rma);
                console.log("2. ABSURL---->" +$location.absUrl());
                // ABSURL---->http://localhost:8383/RmaClient/app/index.html#/rma-detail/%5Bobject%20Object%5D

            };
     });

服务

angular.module('rmaServices', ['ngResource'])
    .factory('rmaService', ['$resource',
        function ($resource) {
            return $resource(
                    'http://localhost:8080/Rma/webresources/com.demo.rma.rma/:rma:id',
                    {},
                    {
                        update: { method: 'PUT', params: {id: '@rma'} }
                    });
        }]);

路由提供商

.config(function ($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .when('/about', {
    templateUrl: 'views/about.html',
    controller: 'AboutCtrl'
  })
  .when('/rma-list', {
    templateUrl: 'views/rma-list.html',
    controller: 'RmaListCtrl'
  })
  .when('/rma-detail', {
    templateUrl: 'views/rma-detail.html',
    controller: 'RmaDetailCtrl'
  })
  .otherwise({
    redirectTo: '/'
  });

}）;

Glassfish的REST服务

@GET
@Path("{id}")
@Produces({"application/json"})
public Rma find(@PathParam("id") Integer id) {
    return super.find(id);
}

@GET
@Override
@Produces({"application/json"})
public List<Rma> findAll() {
    return super.findAll();
}

最佳答案

而不是发送整个对象，而是仅将rma字段作为键发送：

$location.path('/rma-detail/'+rma.rma);
//http://localhost:8383/RmaClient/app/index.html#/rma-detail/1

更改路由，以便可以将rma读取为参数

.when('/rma-detail/:rmaId', {
templateUrl: 'views/rma-detail.html',
controller: 'RmaDetailCtrl'
})

然后在RmaDetailCtrl控制器中，您可以从路由参数获取rmaId

//Remember to inject the $routeParams in controller's constructor
var rma = $routeParams.rmaId; //1
//Call the get rma detail from API

为了简单的学习目的，请勿使用$ resource。使用$ http代替：

var rma = $routeParams.rmaId; //1
$http.get('/Rma/webresources/com.demo.rma.rma/?id=' + rma).success(function(result) {
    console.log(result);
});

//Use $http.get for update