CodeIgniter 2.2.6中如何读取数据库多图片路径并拆分显示

嘿，我明白你卡了4天的痛点——数据库里一行存了多张用逗号分隔的图片路径，现在只能显示第一张，对吧？咱们从模型和视图两方面调整，就能把所有图片都渲染到轮播里了。

方案一：先优化模型（更符合MVC规范） #

你的模型当前返回的是原始数据，我们可以在模型里提前把图片路径拆成数组，这样视图里的逻辑会更清晰：

function uploadslide1() { 
    $this->db->select('*'); 
    $this->db->order_by("id", "DESC"); 
    $query = $this->db->get("sg_slides"); 
    if ($query->num_rows() > 0) { 
        $data = [];
        foreach ($query->result() as $row) {
            // 拆分图片路径为数组，同时去掉路径前后可能的空格（避免加载失败）
            $row->images = array_map('trim', explode(",", $row->image));
            $data[] = $row; 
        } 
        return $data; 
    } 
    return false; 
}

这里没提前拼接base_url是为了灵活性——如果后续域名或上传目录变了，只改视图就行，不用动模型。

方案二：修改视图，循环显示所有图片 #

原来的代码只取了拆分后的第一个图片，现在需要嵌套循环：先遍历每一行数据，再遍历该行的所有图片。另外注意轮播的active类只能给第一个元素：

<div class="carousel-inner" > 
    <?php echo $this->session->flashdata('message')?> 
    <?php 
    $is_first_item = true; 
    foreach($newzw as $result){
        // 遍历当前行的所有图片
        foreach($result->images as $img_path){
            $item_class = $is_first_item ? 'active' : '';
    ?> 
    <div class="item <?php echo $item_class; ?> "> 
        <div class="overlay"></div> 
        <img src="<?php echo base_url().'uploads/images/'.$img_path; ?> " alt="轮播图片" style="height:662px;" > 
    </div> 
    <?php 
            $is_first_item = false; // 第一个图片后就不再加active类
        }
    } 
    ?> 
</div> 
<!-- Left and right controls --> 
</div> 
</div>

如果不想改模型，也可以直接在视图里处理（快速生效，但不够规范）：

<div class="carousel-inner" > 
    <?php echo $this->session->flashdata('message')?> 
    <?php 
    $is_first_item = true; 
    foreach($newzw as $result){
        // 直接在视图拆分图片路径，同时去空格
        $img_paths = array_map('trim', explode(",", $result->image));
        foreach($img_paths as $img_path){
            $item_class = $is_first_item ? 'active' : '';
    ?> 
    <div class="item <?php echo $item_class; ?> "> 
        <div class="overlay"></div> 
        <img src="<?php echo base_url().'uploads/images/'.$img_path; ?> " alt="轮播图片" style="height:662px;" > 
    </div> 
    <?php 
            $is_first_item = false;
        }
    } 
    ?> 
</div>

几个关键提醒 #

• 一定要处理图片路径里的空格！比如数据库里如果是img1.jpg, img2.jpg，拆分后路径会带空格，导致图片加载失败，用array_map('trim', ...)就能解决
• 轮播的active类只能有一个，所以用变量控制只给第一个图片添加
• 优先选修改模型的方案，符合MVC的职责分离原则，后续维护更方便

内容的提问来源于stack exchange，提问作者Iswarya Swaminadhan