我如何可以传递ngRepeat的目的是模态在AngularJS [英] How can I pass an object from ngRepeat to Modal in AngularJS

问题描述

我想从一个ngRepeat对象传递给一个模式窗口......是这样的：

I am trying to pass an object from ngRepeat to a modal window... like this:

<div ng-repeat="slot in slots">
    {{ slot }}<br>
    <button ng-click="openModal()">Open</button>
</div>

<script type="text/ng-template" id="myModalContent.html">

    <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header">
                <h4 class="modal-title">{{ slot.time }}</h4>
            </div>

            <div class="modal-body">
                <p>body</p>
            </div>

            <div class="modal-footer">
                footer
            </div>

        </div>

    </div>

</script>

在控制器：

$scope.openModal = function () {
    $modal.open({
        templateUrl: 'myModalContent.html'
    })
}

什么是通过槽模态没有搞乱的范围和造成时髦行为的正确方法？我试图传递插槽＆LT;按钮NG-点击=openModal（插槽）＆GT; ... 哪种工作，但奇怪的事情开始发生害得我相信这是不正确的事情。有什么建议？

What is the correct way to pass the slot to the modal without messing up the scope and causing funky behaviour? I tried passing the slot in <button ng-click="openModal(slot)">... which kind of worked but strange things started happening which led me to believe it wasn't the right thing to do. Any advice?

推荐答案

只是通过在你给的标识符为对象的数组名。

Just pass in the name you gave the identifier for your array of objects.

例如，对于对象的后续阵列

For example, for the follow array of objects:

$scope.myArray = [
    {name:"Tyler", job:"Developer"},
    {name:"Tony", job:"Designer"},
    {name:"Tabby", job:"PM"},
    {name:"Todd", job:"Grunt"}
]

访问他们像这样：

Access them like so:

<div ng-repeat="person in myArray">
    <div ng-click="openModal(person)">Push me</div>
</div>

然后，你有你的myFunction的函数内部访问：

Then you have access inside your myFunction function:

$scope.openModal = function(person) { console.log(person) };

这篇关于我如何可以传递ngRepeat的目的是模态在AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！