knockout实现嵌套循环绑定

亦凉 2022-04-15 03:56 257阅读 0赞

转自：[https://blog.csdn.net/qq\_26775359/article/details/78269909][https_blog.csdn.net_qq_26775359_article_details_78269909]

实现效果如下：

代码：

<script type="text/javascript" src="knockout-2.2.0.js"></script>  
   
 <ul data-bind="foreach: \{ data: categories, as: 'category' \}">   
     <li>   
         <ul data-bind="foreach: \{ data: items, as: 'item' \}">   
             <li>   
                 <span data-bind="text: category.name"></span>:   
                 <span data-bind="text: item"></span>   
             </li>   
         </ul>   
     </li>   
 </ul>   
     
 <script>  
     var viewModel = \{  
         categories: ko.observableArray(\[  
             \{ name: 'Fruit', items: \['Apple', 'Orange', 'Banana'\] \},  
             \{ name: 'Vegetables', items: \['Celery', 'Corn', 'Spinach'\] \}  
         \])  
     \};  
     ko.applyBindings(viewModel);   
 </script>

\---------------------   
作者：Kc的K   
来源：CSDN   
原文：https://blog.csdn.net/qq\_26775359/article/details/78269909   
版权声明：本文为博主原创文章，转载请附上博文链接！

[https_blog.csdn.net_qq_26775359_article_details_78269909]: https://blog.csdn.net/qq_26775359/article/details/78269909

发表评论取消回复

表情：

评论列表（有 0 条评论，257人围观）

还没有评论，来说两句吧...

相关阅读

相关 Angular中数据文本绑定、绑定Html、绑定属性、双向数据绑定的实现方式

场景 Angular介绍、安装Angular Cli、创建Angular项目入门教程： [https://blog.csdn.net/BADAO\_LIUMANG\_Q

系统管理员/ 2023年10月07日 13:31/ 0 赞/ 150 阅读

相关【SSM - SpringMVC篇】03 - SpringMVC的参数绑定 - 参数自动绑定 - javabean对象参数绑 - 嵌套bean参数绑定

文章目录 SpringMVC的参数绑定 1 传统方式进行参数传递 2 通过SpringMVC的参数绑定实现【\\\用

古城微笑少年丶/ 2022年12月14日 08:49/ 0 赞/ 412 阅读

相关 php 事件绑定,php实现事件绑定

class EventHandle \{ private static $\_map = array(); //类似jquery绑定事件 public function

谁践踏了优雅/ 2022年11月12日 12:54/ 0 赞/ 444 阅读

相关早绑定,晚绑定和其实现

早绑定,晚绑定,早晚都要绑定--引用网友的话绑定:在对象和其类型间建立关联的过程早绑定指在对象申明的时候就和他的类型建立了关联晚绑定是指我们的代码在运行时再检查对象

小咪咪/ 2022年09月18日 11:52/ 0 赞/ 234 阅读

相关 knockout href 绑定

<div class="row tr" data-bind="foreach: Items"> <div class="small-2 columns" data-bind=

向右看齐/ 2022年08月07日 11:39/ 0 赞/ 238 阅读

相关 knockout select绑定，选中默认值

<script type="text/javascript"> $(function()\{ var viewModel =function() \{ var se

我就是我/ 2022年08月07日 11:39/ 0 赞/ 344 阅读

相关 Vue 循环绑定value

就是 :value=“xxx” 就这样其他别看了妈蛋…… <template v-for="(item,index) in list"> <div cl

心已赠人/ 2022年05月13日 04:54/ 0 赞/ 246 阅读

相关 knockout实现嵌套循环绑定

转自：[https://blog.csdn.net/qq\_26775359/article/details/78269909][https_blog.csdn.net_qq_

亦凉/ 2022年04月15日 03:56/ 0 赞/ 258 阅读

相关 vue基础：数据绑定，绑定属性，循环渲染

<template> <div id="app"> <h2>你好vue{ {msg}}</h2>/数据绑定/

傷城~/ 2022年03月25日 06:46/ 0 赞/ 401 阅读

相关 jquery easyui datagrid列绑定嵌套对象

1. json的数据格式： var map = \{"uname":'',"upwd":'',"role":\{“rolename”:'',"roleLevel"

墨蓝/ 2021年12月14日 10:59/ 0 赞/ 338 阅读