Ang-JS中的Angular JS绑定范围数据形成

Raj*_*Raj 2 angularjs ng-repeat

我在$ scope.data中有一组项目,其中包含"id","name"和"age"字段,这些项目使用ng-repeat指令显示在视图中.对于每组项目,都有一个相应的"编辑按钮".

我希望能够访问按下编辑按钮的特定项目集的值.

HTML:

<div ng-controller="Ctrl">
    <div ng-repeat="i in data">
        Name: {{i.name}}
        Age: {{i.age}}

        <form ng-submit="submit()">
            <input type="text" ng-model="i.id"/>
            <input type="submit" value="Edit" />
        </form>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

脚本:

function Ctrl($scope) 
{
  $scope.data = [
    {id:1,name:"Alex",age:22},
    {id:2,name:"Sam", age:28}
    ];

    $scope.submit = function() {
        //access id of user for which edit was clicked
    };
}
Run Code Online (Sandbox Code Playgroud)

这样做的正确方法是什么?

Dav*_*yon 6

我建议您只使用一个按钮而不是表格:

<div ng-controller="Ctrl">
    <div ng-repeat="i in data">
        Name: {{i.name}}
        Age: {{i.age}}

        <input type="text" ng-model="i.id"/>
        <button ng-click="submit(i)">Edit</button>

    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

只需发送i按钮点击事件(我想你可以使用表格,如果你需要验证,但你的例子似乎不需要它).

submit然后你的功能改为:

$scope.submit = function(selectedItem) {

    // here you now have access to selected item    
};
Run Code Online (Sandbox Code Playgroud)