Angular JS on Rails -参数'不是函数，没有定义

Angular JS on Rails - Argument 'RaffleCtrl' is not a function, got undefined

本文关键字：函数 定义 on JS Rails 参数 Angular      更新时间：2023-09-26

我正在学习一个RoR项目的整型Angular JS教程。

在我的控制器js文件我有这个:

raffle.coffee 

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
@RaffleCtrl = ($scope) ->
    $scope.entries = [  
        {name:"name1"}
        {name:"name2"}
        {name:"name3"}
        {name:"name4"}
    ]

和在我的控制器HTML(由rails生成)我有这个:

index.html.erb 

<h1>Raffle</h1>
<div ng-controller="RaffleCtrl">
    <form>
        <input type="text" ng-model="newEntry.name">
    </form>
    <ul>
        <li ng-repeat="entry in entries">
            {{entry.name}}
        </li>
    </ul>
</div>

所以它应该重复数组条目中的四个名称，但它不起作用:我打开日志，我发现这个错误:

参数' raffectrl '不是一个函数，得到undefined

你必须在application.html.erb:

中定义ng-app指令
<html ng-app="Raffler">
...
</html>

然后在raffle.js.coffee中替换:

@RaffleCtrl = ($scope) ->
与这个:

angular.module('Raffler', []).controller "RaffleCtrl", ($scope) ->

你必须在Angular应用中设置所需的ng-app指令——它指定该元素为根元素。在您的应用程序布局中，在像body或html标记这样的高级/根元素上执行此操作。重要的是，你只能指定一次指令一次——如果你错误地添加了多个，那么应用中的第一个指定将被用来定义根元素。

添加ng-app后，使用ng-app中指定的名称指定匹配的根模块。将定义中的数组保留为空表明您正在定义模块而不是调用它。你使用什么名字并不重要，只要确保它能相对描述你的应用，在你的模块中是唯一的，并且你为你在ng-app中添加的根模块指定了完全相同的名字。这个模块要么直接包含应用程序代码，要么依赖于包含它的其他模块。

基本上，您必须给您的应用程序一个ng-app属性，指定文档的根元素。然后你必须用同样的名字创建你的Angular根模块——在本例中是"Raffler"。

这应该是相关的，但我使用的是Rails '4.1.5'和angularjs-rails gem 1.4.4.

相关文章：