Question

在我的应用中，我有ng-repeat循环，我从另一个列表中选择媒体并将其推送到数组medias。但是对于每种媒体，我都可以输入自定义持续时间（从对象中的媒体列表中获取预定义的媒体持续时间，但如果我们想要，我们可以设置自定义持续时间）

<div ng-controller="MyCtrl">
    <div ng-repeat="media in medias">
        <span>{{media.title}}</span><br>
        <input ng-model="media.duration" /><br><br>
    </div>
    <button ng-click="getInputValue(media.title, media.duration)">Get</button>
</div>

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
$scope.medias = [{
  title: 'res1',
  duration: 25.2
},
{
  title: 'res2',
  duration: 15.00
}
];


$scope.getInputValue = function(title, duration) {
alert(title);  //undefined
alert(duration);  //undefined
}
}

这是jsfiddle

并且，在提交时，我需要采取所有自定义更改的持续时间并将其发送到API。第一个问题是，在我的GET按钮值为undefined 此按钮需要在ng-repeat div之外，因为我在页面上有另一个数据用于发送。

我试着放ng-init，但是这个火上加载，什么都没有。另外，我尝试ng-change，但ng-model的名称相同（因为它是动态的），因此，我不知道我更改了哪个项目。

想法是，当用户更改他想要的媒体的持续时间时，在提交时我获取数据并将它们放入如下数组中：

//get passed data from ng-repeat
  var mediaCustomDuration = [];
$scope.getInputValue = function(title, duration) {

    mediaCustomDuration.push({
    mediaID: title,
    mediaDuration: duration
 });
//do stuff ...
}
}

Answer 1

ng-click="getInputValue(media.title, media.duration)"

超出重复范围，因此此值（media.title和...）始终未定义

所以这里有两个解决方案：

单击时，您需要遍历媒体（$ scope.medias）并收集所需的数据。 Ng模型确保您的自定义持续时间将被设置到媒体对象中，您可以选择它并发送到服务器。

另一个

制作按钮类型=“提交”
在表格ng-submit =“submit（$ scope.medias）”
在$ scope.submit中取medias（它们已被更改）并将它们发布到远程。
这就是全部

希望这会有所帮助。

从ng-repeat输入中获取ng-model值

1 个答案: