2016-04-17 3 views
0

Я использую NPM и некоторые угловые пакеты. Я пытаюсь следовать этот учебник, часть 1: Базовая сетка linkНеуверенный в том, как пререкаться с моими зависимостями от javascript

Моя установка каталога файла:

D:/nodeStuff/uiGrid, который содержит:

node_modules uigrid.css uigrid.html uigrid.js 

Папка node_modules содержит:

angular angular-animate angular-touch angular-ui-grid 

Я не могу решить эту ошибку в моем браузере консоли:

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to: 
Error: [$injector:modulerr] Failed to instantiate module angular-touch due to: 
Error: [$injector:nomod] Module 'angular-touch' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. 

Я знаю, что учебник дает jsfiddle, но она импортировала зависимости в CSS (это нормально?) И я озадачен о том, как заставить его работать за пределами jsfiddle

Мой HTML:

<script src="./node_modules/angular/angular.js"></script> 
<link rel="stylesheet" type="text/css" href="./node_modules/angular-ui-grid/ui-grid.css" /> 
<script src="./node_modules/angular-ui-grid/ui-grid.js"></script> 
<script src="./node_modules/angular-touch/angular-touch.js"></script> 
<script src="./uigrid.js"></script> 

<div ng-app="app"> 
    <div ng-controller="MainCtrl"> 
     <div ui-grid="{ data: myData }" class="grid"></div> 
    </div> 
</div> 

Мой JavaScript:

var app = angular.module('app', ['angular-touch', 'ui.grid']); 
app.controller('MainCtrl', ['$scope', function ($scope) { 
    $scope.myData = [{ 
     "firstName": "Cox", 
     "lastName": "Carney", 
     "company": "Enormo", 
     "employed": true 
    }, { 
     "firstName": "Lorraine", 
     "lastName": "Wise", 
     "company": "Comveyer", 
     "employed": false 
    }, { 
     "firstName": "Nancy", 
     "lastName": "Waters", 
     "company": "Fuelton", 
     "employed": false 
    }]; 
}]); 

Мой CSS:

.grid { 
    width: 500px; 
    height: 250px; 
} 

ответ

Смежные вопросы