使用 Play! 将 json 对象属性注入锚点的 href 属性中框架

Question

我有一个 jQuery ajax 调用，如下所示：

    $.ajax({
       type     : 'GET',
       dataType : 'json',
       url      : '/Zoo/animals',
       success  : function(data){
           var count = data.length;               
           for(var i = 0; i < count; i++) {
               ${'#tableBody').append('<tr><td>');
               ${'#tableBody').append('<a href="@{Animal.index(data[i].name)}">' + data[i].name + '</a>');
               ${'#tableBody').append('</td></tr>');
           }
       }
    })

现在，除了 href 属性之外，所有这些都可以正常工作。玩！给我以下错误：

Exception raised was NullPointerException : Cannot get property 'name' on null object.

从 ajax 调用返回的 json 字符串很好，因为链接的文本按预期显示为动物的名称。我想将动物的名称传递给 Animal.index 操作，但无法这样做。

更新：

正如其他人提到的，我也尝试过这个：

${'#tableBody').append('<a href="@{Animal.index(' + data[i].name + ')}">' + data[i].name + '</a>');

这只会产生以下链接：

localhost:9000/animal/index?name=+%2B+data[i].name+%2B+

Answer 1

问题是玩！在提供文件时（在执行任何 javascript 之前）生成 url。对这里或那里的字符串或引号进行任何更改都不会对您有帮助。

解决方法：

var url = "@{Animal.index(XXX)}".replace('XXX', data[i].name);
${'#tableBody').append('<a href="'+url+'">' + data[i].name + '</a>');

这允许播放！在“编译”时生成其 url，然后 javascript 在“运行”时简单地执行替换。不确定是否可以玩！将查找名为 XXX 的变量，如果是，则在服务器端添加一个名为 XXX 且值为“XXX”的哑变量。

更新

我没有玩！我前面的实例可以摆弄，但除了变量之外，您还可以通过引用 XXX: 直接将字符串作为值插入：

var url = '@{Animal.index("XXX")}'.replace('XXX', data[i].name);

然后您就不需要名为 XXX 的变量。尽管想法是相同的，但细节需要一些尝试。

Answer 2

这听起来像是 jsAction 标签的工作。它生成一个 javascript 函数，其工作原理与 davin 的答案相同。

您可以将 var AnimalAction = #{jsAction @Animals.index(':name') /}; 放在 ajax 调用之前的某个位置，然后将链接生成代码更改为：

${'#tableBody').append('<tr><td>');
${'#tableBody').append('<a href="' + animalAction({ name: data[i].name }) + '">' + data[i].name + '</a>');
${'#tableBody').append('</td></tr>');

您会注意到生成的函数接受一个对象作为参数，因此它可以支持任意数量的参数。

文档中没有明确说明的是标签 (:name) 必须与相应控制器操作中的参数名称相同 (public static void index(String name ))，当然必须与 routes 文件中指定的方式相同 (GET /animals/{name} Animals.index)。

Answer 3

data 是一个 javascript 对象，您需要指定类似于打印链接文本的方式。你能试试这个吗？

 ${'#tableBody').append('<a href="@{Animal.index(' + data.name + ')}">' + data.name + '</a>');

Answer 4

您正在循环 data 数组，但需要通过索引 i 引用每个数据对象，就像 data[i] 一样。我会尝试这个：

$.each(data, function(k, item) {
    $('#tableBody').append('<tr><td><a href="@{Animal.index(' + item.name + ')}">' + item.name + '</a></td></tr>');
});

这将替换成功回调中的所有内容

Answer 5

你应该改变这一行 -

${'#tableBody').append('<a href="@{Animal.index(data[i].name)}">' + data[i].name + '</a>');   

到这个 -

${'#tableBody').append('<a href="@{Animal.index('+data[i].name+')}">' + data[i].name + '</a>');