Angular JS + CoffeeScript + JSFiddle:代码不能正常工作

Ale*_*ura 2 coffeescript jsfiddle angularjs

我今天开始玩CoffeeScript和AngularJS,并注意到没有很多关于如何使用CoffeeScript正确编写AngularJS的文档或示例.我自己的实验似乎没有奏效.作为一个教学上的例外,有人能指出我为什么这个小提琴不起作用?

http://jsfiddle.net/dralexmv/8km8x/4/

它声称没有定义InventoryModule.虽然我已经在第一行宣布了它.

这是HTML:

<div ng-app='InventoryModule' ng-controller='InventoryController'>
<table>
    <tr ng-repeat='item in items'>
        <td>{{item.title}}</td>
        <td>{{item.price | currency}}</td>
    </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

这就是CoffeeScript:

inventoryModule = angular.module 'InventoryModule', []

inventoryModule.factory 'Items', ->
    items = {}
    items.query -> [
        {title: 'Table', price: '5'},
        {title: 'Chair', price: '10'}
    ]
    items

inventoryModule.controller 'InventoryController', ($scope, Items) ->
    $scope.items = Items.query
Run Code Online (Sandbox Code Playgroud)

Ben*_*aum 5

您的代码包含以下内容

items.query -> [{title: 'Hello', price: '5'}]
Run Code Online (Sandbox Code Playgroud)

这意味着:

  var items = {};
  items.query(function() { // Items has no method query
    return [{
        title: 'Hello',
        price: '5'
      }];
  });
Run Code Online (Sandbox Code Playgroud)

你的意思是将一个成员定义为一个函数,所以它应该是:

items.query = () -> [{title: 'Hello', price: '5'}]
Run Code Online (Sandbox Code Playgroud)

这意味着:

  var items = {};

  items.query = function() {
    return [{
        title: 'Hello',
        price: '5'
      }];
  };
Run Code Online (Sandbox Code Playgroud)

这是你的意思:)

(小提琴)