Javascript AngularJS中的传递模型

我正在从主干网构建我的第一个AngularJS应用程序。我有一个列表，用户可以在其中选择一个项目。目标是在列表下方的视图中显示所选项目的详细信息。列表视图和详图视图都是主视图的一部分

我的列表视图

<div id="rfc-records" class="container-fluid">
    <div ng-repeat="record in records" ng-click="selectRow()" class="row select table-row">
        <div class="col-lg-1 center">
            {{record.id}}
        </div>
        <div class="col-lg-1 center">
            {{record.rfcObject}}
        </div>
        <div class="col-lg-5">
            {{record.rfcFunction}}
        </div>
        <div class="col-lg-2">
            {{record.status}}
        </div>
        <div class="col-lg-3">
            {{mii.utils.date.extToIntDate(record.firstProcessing)}}
        </div>
    </div>
</div>

主控制器

 $scope.selectRow = function(record){
    alert(record.id); // undefined
}

结果未定义，因此这不起作用。另外，将模型从视图传递回控制器似乎是一种糟糕的方法。我可能能够让应用程序正常工作，但我有一种感觉，那就是我不会按照预期使用范例

在主干中，对于模型绑定到的每一行，我都有一个单独的视图。但在角度模型中并不像主干模型那样明确

总的来说，我不太明白模型是如何工作的。R

关于这个例子，我有以下问题：

我如何知道列表中选择了什么项目

我应该将

selectRow

功能放在哪里？在Mainview的控制器中还是在list view指令中

如何将所选模型传递到“详细信息”视图

---

嗯，将当前项传递给

ngClick

处理程序是解决此任务的非常常见的方法。我不知道为什么它对你不起作用，它应该。下面是这种典型方法的示例

在主干中，对于模型绑定到的每一行，我都有一个单独的视图。但在角度模型中并不像主干模型那样明确

实际上，在这个问题上，Angular更为优雅。在每个迭代行中仍然有可用的模型。在控制器中，您可以将当前子作用域称为

this

。因此，在您的情况下，如果您不想在单击时将

record

对象传递到控制器函数中，您可以使用

this

，它将指向当前范围对象（请记住，

ngRepeat

为每一行创建新的子范围）：

您不必传递HTML格式的任何内容：

ng-click="selectRow()"

---

演示：ng click和ng repeat在同一个div中。您可以在这个重复的div中添加一个新div，就像这样，这对我很有用：

<div id="rfc-records" class="container-fluid">
    <div ng-repeat="record in records" ng-click="selectRow()" class="row select table-row">
        <div class="col-lg-1 center">
            {{record.id}}
        </div>
        <div class="col-lg-1 center">
            {{record.rfcObject}}
        </div>
        <div class="col-lg-5">
            {{record.rfcFunction}}
        </div>
        <div class="col-lg-2">
            {{record.status}}
        </div>
        <div class="col-lg-3">
            {{mii.utils.date.extToIntDate(record.firstProcessing)}}
        </div>
    </div>
</div>

<div id="rfc-records" class="container-fluid">
    <div ng-repeat="record in records" class="row select table-row">
        <div class="col-lg-1 center">
            Select This item<input type=button ng-click="selectRow(record)">
        </div>
        <div class="col-lg-1 center">
            {{record.id}}
        </div>
        <div class="col-lg-1 center">
            {{record.rfcObject}}
        </div>
        <div class="col-lg-5">
            {{record.rfcFunction}}
        </div>
        <div class="col-lg-2">
            {{record.status}}
        </div>
        <div class="col-lg-3">
            {{mii.utils.date.extToIntDate(record.firstProcessing)}}
        </div>
    </div>
</div>

选择此项目
{{record.id}
{{record.rfcObject}
{{record.rfcFunction}
{{record.status}
{{mii.utils.date.extToIntDate（record.firstProcessing）}

代码中的ng repeat将显示记录列表中的所有行。您是否希望只显示记录ID的列表并单击它，然后移动到该记录的详细视图？然后返回列表并再次执行同样的操作。您应该将“selectRow”函数放入控制器中。你甚至没有在问题中张贴你的指令。你的details-view也一样。谢谢，让它工作起来了！确实很优雅。你能回答问题2和3吗？

<div id="rfc-records" class="container-fluid">
    <div ng-repeat="record in records" class="row select table-row">
        <div class="col-lg-1 center">
            Select This item<input type=button ng-click="selectRow(record)">
        </div>
        <div class="col-lg-1 center">
            {{record.id}}
        </div>
        <div class="col-lg-1 center">
            {{record.rfcObject}}
        </div>
        <div class="col-lg-5">
            {{record.rfcFunction}}
        </div>
        <div class="col-lg-2">
            {{record.status}}
        </div>
        <div class="col-lg-3">
            {{mii.utils.date.extToIntDate(record.firstProcessing)}}
        </div>
    </div>
</div>