javascript - 淘汰赛和coffeescript - uncouched 类型错误

Question

我想用淘汰赛和咖啡脚本维护简单的应用程序。我想添加 Json 对象数组，例如：

[
    {
        Name = "",
        Subscribe = "",
        ScrollOfDish = [0]
    },
    {
        Name = "",
        Subscribe = "",
        ScrollOfDish = [0]
    }
]

这是我的代码：

class Complex
        constructor: ()->
            @ComplexItems = ko.observableArray()
            @getAllComplex()
        self = this

        getAllComplex:()->
            $.ajax
                type: "POST"
                url: "/Complex/GetAllComplex"
                data: {}
                dataType:"json"
                contentType:"json"
                success:(res)->
                        self.ComplexItems res // here is the problem


    $(document).ready ()->
        window.model = new Complex()
        ko.applyBindings(model)

但是我遇到了 uncouched 类型错误 ComplexItems is not a function 的问题。当然，我尝试反向self.ComplexItems并且model.ComplexItems- 它不起作用 - 但我想了解为什么我的示例不起作用。

Answer 1

你self = this在错误的地方..现在它让'self'指向构造函数（而不是类的任何实例..）。应该：

class Complex
    constructor: ()->
        @ComplexItems = ko.observableArray()
        @getAllComplex()        

    getAllComplex:()->
        self = this    
        $.ajax
            type: "POST"
            url: "/Complex/GetAllComplex"
            data: {}
            dataType:"json"
            contentType:"json"
            success:(res)->
                    self.ComplexItems res


$(document).ready ()->
    window.model = new Complex()
    ko.applyBindings(model)

Answer 2

首先，您需要修复您的 JSON 以使用:而不是=. 您可以像这样删除逗号甚至花括号：

[
  Name: ''
  Subscribe: ''
  ScrollOfDish: [0]
,
  Name: ''
  Subscribe: ''
  ScrollOfDish: [0]
]

这是视图模型代码的工作版本：

$ ->

  class Complex
    constructor: ->
      @complexItems = ko.observableArray()
      @getAllComplex()

    getAllComplex: ->
      $.ajax
        type: 'POST'
        url: '/Complex/GetAllComplex'
        data: {}
        dataType: 'json'
        contentType: 'json'
        success: (res) =>
          @complexItems res

  window.model = new Complex()
  ko.applyBindings model

您可以简单地使用粗箭头=>绑定complexItems到右侧this。我做了一些风格上的改变：

1. 使用->代替() ->
2. 使用@代替this
3. 变量名使用驼峰式大小写 ( complexItems)
4. 对非插值字符串使用单引号
5. 使用$ ->代替$(document).ready ->

我建议阅读这个风格指南。