Question

我在我的项目中使用敲除和引导，我有一个我的人的数组，并希望在我的投资组合页面中显示它们，我想有一个3列的引导行，我使用敲出绑定，这是我的HTML代码：

 <div class="row" data-bind="foreach:personarray">
    <div class="col-sm-4 col-lg-4">
        <div class="rowg">
            <a href="#"><img data-bind="attr:{src:Image}" height="250" width="250" class="img-circle img-responsive center-block" /> </a>
            <h3 class="headertext" data-bind="text:Name"></h3>
            <p class="parageraf" data-bind="text:Desc"></p>
            <ul class="list-inline social-buttons ulg">
                <li>
                    <a href="#">
                        <i class="fa fa-twitter"></i>
                    </a>
                </li>
                <li>
                    <a><i class="fa fa-facebook"></i> </a>
                <li>
                    <a><i class="fa fa-linkedin"></i> </a>
                </li>
            </ul>
        </div>
    </div>
</div>

我在我的java脚本文件中填充我的人物。问题是，当我使用F12时，我发现只有一个带有6列的引导行！但我想要2行，每行必须有3列我尝试将每个绑定放在不同的标签中，但不是它们创建我想要的

这是我的JS代码：

define(['services/logger'], function (logger) {
var title = 'Portfolio';
var PersonID = ko.observable();
var personarray = ko.observableArray([]);
var vm = {
    activate: activate,
    title: title,
    personarray: personarray
};

return vm;

//#region Internal Methods
function activate() {
    logger.log(title + ' View Activated', null, title, true);
    $.getJSON('api/Person/GetPersons', function (result) {

        personarray(result);
    });
return true;
}
//#endregion
 });

我的rowg类只包含填充和文本对齐。谁能帮我谢谢

Answer 1

您可以使用if来检查您是否在数组的第3个元素上，并在这种情况下创建一个新行。

检查它是否是你可以使用的第3个元素（在foreach中）：

$index() % 3 == 0

以下是您可以用来解决问题的示例： https://jsfiddle.net/aq66405h/

使用淘汰js创建不同的行

1 个答案: