仅在模型对象上获取过滤数据作为结果，angularjs(Get filtered data only on model object as result, angularjs)

我的代码是这样的

<body ng-app="myApp" ng-controller="MainCtrl"> <div>Name only <input ng-model="search.name" /> <br /> <table id="searchObjResults"> <tr> <th>Name</th> <th>Phone</th> </tr> <tr ng-repeat="friendObj in friends | filter:search:strict | limitTo:1"> <td>{{friendObj.name}}</td> <td>{{friendObj.phone}}</td> </tr> </table> </div> <div> <button type="button" id="btn_submit" ng-click="submitForm()">Get rates</button> </div>

angular.module('myApp', []).controller('MainCtrl', ['$http', '$scope', function ($http, $scope) { $scope.friends = [{ name: 'John', phone: '555-1276' }, { name: 'Mary', phone: '800-BIG-MARY' }, { name: 'Mike', phone: '555-4321' }, { name: 'Adam', phone: '555-5678' }, { name: 'Julie', phone: '555-8765' }, { name: 'Juliette', phone: '555-5678' }]; $scope.submitForm = function () { // i want to get the data here }; }]);

正如您所看到的那样，我的屏幕上只有一位friend会活跃。当我按下提交按钮时，我希望该数据（已过滤的单行）成为我当前$scope.friends上的唯一值，以便我可以将其作为所选数据发送到外部服务。任何人都可以在这里指出我需要做的事吗

注意：我无法更改此按钮的位置。

My code is like this

<body ng-app="myApp" ng-controller="MainCtrl"> <div>Name only <input ng-model="search.name" /> <br /> <table id="searchObjResults"> <tr> <th>Name</th> <th>Phone</th> </tr> <tr ng-repeat="friendObj in friends | filter:search:strict | limitTo:1"> <td>{{friendObj.name}}</td> <td>{{friendObj.phone}}</td> </tr> </table> </div> <div> <button type="button" id="btn_submit" ng-click="submitForm()">Get rates</button> </div>

angular.module('myApp', []).controller('MainCtrl', ['$http', '$scope', function ($http, $scope) { $scope.friends = [{ name: 'John', phone: '555-1276' }, { name: 'Mary', phone: '800-BIG-MARY' }, { name: 'Mike', phone: '555-4321' }, { name: 'Adam', phone: '555-5678' }, { name: 'Julie', phone: '555-8765' }, { name: 'Juliette', phone: '555-5678' }]; $scope.submitForm = function () { // i want to get the data here }; }]);

As you can see at a time only one friend will be active on my screen. when I press my submit button, I want that data (filtered single row) to be the only value on my current $scope.friends so that I can send it to an external service as the selected data. Can any one point out what i need to do here Fiddle

Note: I can't change the position of this button.

最满意答案

为什么不让你的按钮成为表格行的一部分，因为只有一个？这是一个JSFiddle，显示它以这种方式工作。

然后，按钮的ng-click函数处理程序可以简单地获取您感兴趣的实际friendObj参数：

<button type="button" ng-click="submitForm( friendObj )">Get rates</button>

编辑：如果你不能移动按钮，实际上有一种方法可以做到这一点; 使ng-repeat在新数组上运行，该数组可在ng-repeat之外访问。所以你的ng-repeat语句变为：

然后你的按钮可以简单地引用单元素数组：

<button type="button" ng-click="submitForm( newArray )">Get rates</button>

在这里更新了小提琴 :-)

Why not make your button part of the table row, since there will only ever be one? Here is a JSFiddle showing it working in that fashion.

The ng-click function handler for the button can then simply take a parameter that is the actual friendObj you are interested in:

<button type="button" ng-click="submitForm( friendObj )">Get rates</button>

EDIT: There is actually a way to do this if you can't move the button; make the ng-repeat operate over a NEW array, which will be accessible outside of the ng-repeat. So your ng-repeat statement becomes:

And then your button can simply reference the one-element array:

<button type="button" ng-click="submitForm( newArray )">Get rates</button>

Updated Fiddle here :-)

更多推荐

friends,data,$scope,电脑培训,计算机培训,IT培训"/> <meta name="descripti