0

我需要帮助,我有返回对象的操作(JSON 格式,我使用这个方法:“http://code.msdn.microsoft.com/Build-truly-RESTful-API-194a6253”),这是我的对象从操作返回(DashboardController 的索引):

   var model = new DashboardHomeModel()
        {                
            CurrentCompaigns = .....................,
            BuzzLeaderCompaigns = ..................,            
            BuzzCompaignByInterest =  ..................
        };
    return View(model);

首先我想显示我的模型的 BuzzLeaderCompaigns(它是 Compaign 的 ICollection),这是我的观点:

               <h3>My Compaign</h3>
       <table>
            <thead>
                  <tr>
                   <th>Compaign Name</th><th>Compaign Description</th><th>End Date</th>
                 </tr>
            </thead>
           <tbody data-bind="foreach: BuzzLeaderCompaigns">
             <tr>
               <td data-bind="text: Name" ></td>            
                <td data-bind="text: Description"></td>
                <td data-bind="text: EndDate"></td>
              </tr>       
          </tbody>
       </table>

 <script type="text/javascript">
      function Compaign(data) {
           this.BuzzCompaignId = ko.observable(data.BuzzCompaignId);
           this.Name = ko.observable(data.Name);
           this.Description = ko.observable(data.Description);
           this.EndDate = ko.observable(data.EndDate);
      }

      function DashboardViewModel() {
           var self = this;
           self.BuzzLeaderCompaigns = ko.observableArray([]);      
           self.CurrentCompaigns = ko.observableArray([]);
           self.BuzzCompaignByInterest = ko.observableArray([]);
        // Load initial state from server, convert it to Task instances, then populate self.tasks
        $.getJSON("/Dashboard/Index", function (Data) {
              var mappedData = $.map(Data, function() { return   } ) ;
      });

      } 
     ko.applyBindings(new DashboardViewModel());

    </script>

如何将我的数据绑定到我的视图模型(当我使用 $.getJSON 获取数据时)然后我的视图

4

3 回答 3

1

假设 /Dashboard/Index 返回 CurrentCompaigns,请更改:

$.getJSON("/Dashboard/Index", function (Data) {
    var mappedData = $.map(Data, function() { return   } ) ;
});

对此:

$.getJSON("/Dashboard/Index", function (Data) {
    var mappedData = $.map(Data, function(item) { return new Compaign(item) });
    self.CurrentCompaigns(mappedData);
});

但是,您应该考虑 Arbiter 的建议;/Dashboard/Index 听起来像是应该返回视图的操作方法,而不是 JSON 操作方法。您可以为您的三个 observableArrays 使用三个单独的 JSON 方法,或者您可以使用一个方法返回所有“Compaigns”,然后使用 ko.utils.arrayFilter 过滤并为您的三个数组分配值。

于 2012-07-27T17:01:48.280 回答
0

A couple of things that will put you on the right track:

  • If your view (cshtml) is called "Index" then you should create a different action on your controller to return your json.
  • Instead of returning View(model); you should have your new action return Json(model, JsonRequestBehavior.AllowGet); to have the action return JSON (instead of HTML). Your existing action (Index) should return a model-less view, i.e. return View();
  • Change the path of your getJSON to use the new path, i.e.:

    $.getJSON("/Dashboard/GetCampaign", function (Data) { Code which populates your viewmodel );

于 2012-07-17T12:57:39.460 回答
0

您也可以使用一些服务器端代码将您的视图模型直接转换为 Json 字符串:

 <script type="text/javascript">    
        // this example is using Json.Net  
        var model = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter()));
        // wrapper contains additional methods and logic 
        // knockout mapping plugin is used to convert json objects to observable objects
        var wrapper = new ViewModelWrapper(ko.mapping.fromJS(model));           
        ko.applyBindings(wrapper);
  </script>
于 2012-07-17T13:18:27.137 回答