未捕获错误:无模块:LocalStorageModule

时间:2013-08-18 22:11:24

标签: angularjs coffeescript local-storage

我正在尝试使用Local Storage处理AngularJS项目。 我正在制作一个待办事项列表应用程序并使用angular-local-storage存储每个待办事项。 我制作了localStorageService,用于我的控制器。我已将该服务作为依赖项注入到我的app.js中,但是我一直收到空白页面和控制台错误:Uncaught Error: No module: LocalStorageModule。我的语法有问题吗?......或者我的服务使用不正确?

app.coffee

@angTut = angular.module("angTut", ['LocalStorageModule']);

@angTut.config(["$routeProvider", ($routeProvider) ->
$routerprovider = $routeProvider;
$routeProvider.when("/",
    templateUrl: "views/Pages/welcome.html"
    controller: "PagesController"
);
$routeProvider.when("/add",
    templateUrl: "views/Todos/add.html"
    controller: "TodosController"
);
$routeProvider.otherwise(
    redirectTo: "/"
);
])

todo_controller.coffee

"use strict"
@angTut.controller('TodosController', (
$scope
todoService
) ->
$scope.save = ->
    todoService.add($scope.note)
    $scope.list()

$scope.clear = ->
    todoService.clear()
    $scope.list()

$scope.list = ->
    $scope.notes = []
    storedNotes = todoService.get(true)
    if storedNotes?
        i = 0
        while i < storedNotes.length
          $scope.notes.push storedNotes[i]
          i++

)

todo_service.coffee

'use strict'
@angTut.service('todoService', (
localStorageService
) ->
addFn = (data) ->
    existingValue = getFn();
    if(existingValue isnt null)
        newData = existingValue + ',' + data
        localStorageService.add('someStorageKey', newData)
    else
        localStorageService.add('someStorageKey', data)
    return data

getFn = (returnAsArray) ->
    storedNotes = localStorageService.get('someStorageKey')
    if storedNotes? and returnAsArray
        return storedNotes.split(',')
    else
        return storedNotes

clearFn = ->
    localStorageService.clearAll()

add: addFn
get: getFn
clear: clearFn
)

2 个答案:

答案 0 :(得分:1)

我确信它与您在bower.json中引用依赖关系的方式有关。该组件的名称与github上的项目名称不完全相同。凉亭组件最近可能已重命名,但我对此并不十分肯定。 如果您尝试使用项目名称搜索组件;

bower search angular-local-storage

No results.

我相信您打算使用的组件的名称是'angular-localstorage'。

☺  bower search angular-localstorage                                                                       ruby-2.0.0-p247
Search results:

angular-localstorage git://github.com/grevory/angular-local-storage.git

如果是这种情况,请进行必要的更改,以确保您在“bower.json”文件中引用它。

E.g

"dependencies": {
  ...
  "angular-localstorage": "*"
}

不要忘记在你的视图中正确命名。

请注意,实际的Javascript文件仍为“angular-local-storage.js”

E.g。

<script src="components/angular-localstorage/angular-local-storage.js"></script>

答案 1 :(得分:0)

不是这样,模块确实存在于名称为

的肠道上
angular-local-storage git://github.com/grevory/angular-local-storage.git