绑定事件到函数 Coffeescript。骨干网.js

Question

我正在尝试获取有关 OnChange 事件的 JSON。并对现有的haml页面进行更改。 我的目标是用 json 值填充另一个选择字段。目前我只是想打印一条消息，说明 json 已获取。但我的 html 没有任何变化。

在控制台的网络选项卡中，我看到正在发出 URL 请求，并返回 304 响应。我还可以在响应中看到 json。

events:
    "submit form" : "onSubmit"
    "change [name=repository]" : "onChange"

  onChange: (e) ->
    e.preventDefault()
    name = @$("[name=repository]").val()
    localStorage['new_issue_last_repo'] = name
    token = localStorage['oauth2_github']['accessToken']
    @model = new Assignees(name)
    console.log 'Printttttt'
    @model.fetch {headers : @token},
      success: (model) =>
        @$('.assignee').html("<span>Fetched assignees</span>")
      error: =>
        @$('.assignee').html("<span>Failed to fetch assignees :(</span>")

haml 文件如下所示。

.message
.assignee
%form
  %section.repo-select
    %select{name: 'repository'}
      - for repository in @repositories.models
        - full_name = repository.get('full_name')
        - if localStorage['new_issue_last_repo'] == repository.get('full_name')
          %option{value: full_name, selected: 'selected'}= repository.get('full_name')
        - else
          %option{value: full_name}= repository.get('full_name')

获取 json 后如何让 .assignee 更改。还有如何访问json数据？

我有一个类似的功能。我不知道我在 onChange 函数中做错了什么。

  onSubmit: (e) ->
    e.preventDefault()
    name = @$("[name=repository]").val()
    localStorage['new_issue_last_repo'] = name
    repository = @repositories.find (r) -> r.get('full_name') == name
    model = new IssueModel({
      body: @$("[name=body]").val()
      title: @$("[name=title]").val()
      assignee: @$("[name=assignee]").val()
      milestone: @$("[name=milestone]").val()
    }, {repository: repository})

    model.save {},
      success: (model) =>
        @badge = new Badge()
        @badge.addIssues(1)
        @$('.message').html("<span>Issue <a href=\"#{model.get("html_url")}\" target=\"_blank\">##{model.get('number')}</a> was created!</span>")
      error: =>
        @$('.message').html("<span>Failed to create issue :(</span>")

Answer 1

我对 HAML 不是很了解，但是这个：

%form
  %section.repo-select
    %select{name: 'repository'}

应该变成这样的 HTML：

<form>
    <section class="repo-select">
        <select name="repository">
            <!-- ... -->
        </select>
    </section>
</form>

对吗？这意味着没有任何东西可以匹配 ID 选择器 #repo-select，因此绑定到这些事件的处理程序 onChange 将永远不会被调用。

如果您想从 <select> 获取更改事件，那么您需要在您的 events 中添加类似的内容：

'change [name=repository]'

详见Backbone's View#delegateEvents和jQuery's Selectors文档。

就您的消息而言，我认为您对 Model#save 参数之间的区别有点困惑：

保存 model.save([attributes], [options])

和Model#fetch 参数：

获取 model.save([options])

save 在第二个回调中接受两个参数，所以这是可行的：

model.save {},
  success: (model) => ...
  error: => ...

但是fetch 只接受一个参数，回调应该在那个参数中，所以这样：

@model.fetch {headers : @token},
  success: (model) => ...
  error: => ...

无法工作，因为 fetch 甚至看不到 success 或 error 回调。你会想说：

@model.fetch
  headers: @token
  success: (model) => ...
  error: => ...

获取fetch的所有三个参数。