1

以下是从 knockoutjs 网站教程中获取的示例。我的问题有点复杂，我想为我们的 Web 应用程序创建可重用的向导、控件或组件。

以下场景代表了我面临的一个非常常见的问题，即模板绑定与视图模型属性不同。如果我们查看人员模板是由“名称”属性绑定的，该属性将来自具有“名称”属性的视图模式。现在想象一下我有两个视图模型非常相似但有一些属性名称不同的情况。（如买方和卖方的属性名称为“BuyerName”、“SellerName”，有什么方法可以创建模板，所以我可以绑定到动态属性。

我的意思是在这个例子中将与买方和卖方一起工作。欢迎任何建议或任何想法。

我的问题比这更复杂，我很困惑。

谢谢。 

<h2>Participants</h2>
Here are the participants:
<div data-bind="template: { name: 'person-template', data: buyer }"></div>
<div data-bind="template: { name: 'person-template', data: seller }"></div>

<script type="text/html" id="person-template">
     // Now name property is bind, where as view model has two
     // properties named BuyerName and SellerName, so it is not going to work.
     <h3 data-bind="text: name"></h3>
    <p>Credits: <span data-bind="text: credits"></span></p>
</script>

<script type="text/javascript">
     function MyViewModel() {
         this.buyer = { BuyerName: 'Franklin', credits: 250 };
         this.seller = { SellerName: 'Mario', credits: 5800 };
     }
     ko.applyBindings(new MyViewModel());
</script>
4

2 回答 2

0

假设您通过 AJAX 调用服务器获取数据，我建议使用神奇的的绑定对象将您的逻辑放入其中：

对于您的简单示例，您可以将新属性添加到从服务器获得的对象模型中，并将该新属性用于您的 html 绑定。请使用 create检查自定义对象构造。

或者你用简单的小路来定义你想要的新模型，然后将你从服务器获得的数据绑定到新模型（同样你可以create在映射对象中使用）。

于 2013-09-03T13:09:19.613 回答
0

那么一个经典的多态问题

您必须链接您的模板，基本模板 person-template 应该只包含 BuyerViewModel 和 SellerViewModel 都具有的数据绑定。

任何附加绑定都必须位于买方模板和卖方模板中

就像是

<script id="buyer-template" type="text/html">
   <!-- Fields shared by both classes -->
   <div data-bind="template: { data: $data, template: 'person-template' }></div> 
   <!-- fields for buyer only -->
</script>
于 2013-09-03T09:25:58.500 回答