Question

这是我的HTML

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>AngularJS material-sidenav Plunker</title>
    <!-- style sheet -->
    <link href="bower_components/angular-material-data-table/dist/md-data-table.min.css" rel="stylesheet" type="text/css"/>
    <!-- module -->

        module -->
   <!--   <link href="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.min.css" rel="stylesheet" type="text/css"/>
module -->
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="bower_components/angular-material/angular-material.js"></script>
<script type="text/javascript" src="index3.js" ></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/angular-aria.min.js"></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/angular-aria.js"></script>

<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.min.css"></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.css"></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.min.js"></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table-style.css"></script>
<script type="text/javascript" src="/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.js"></script>


</head>

<body >

<div ng-app="exampleApp" ng-controller="ExampleController" layout-margin>
    <mdt-table>
        <mdt-header-row>
            <mdt-column align-rule="left">Dessert (100g serving)</mdt-column>
            <mdt-column align-rule="right">Calories</mdt-column>
            <mdt-column align-rule="right">Fat (g)</mdt-column>
            <mdt-column align-rule="right">Carbs (g)</mdt-column>
            <mdt-column align-rule="right">Protein (g)</mdt-column>
            <mdt-column align-rule="right">Sodium (mg)</mdt-column>
            <mdt-column align-rule="right">Calcium (%)</mdt-column>
            <mdt-column align-rule="right">Iron (%)</mdt-column>
        </mdt-header-row>
        <mdt-row ng-repeat="nutrition in nutritionList">
            <mdt-cell>{{nutrition.name}}</mdt-cell>
            <mdt-cell>{{nutrition.calories}}</mdt-cell>
            <mdt-cell>{{nutrition.fat}}</mdt-cell>
            <mdt-cell>{{nutrition.carbs}}</mdt-cell>
            <mdt-cell>{{nutrition.protein}}</mdt-cell>
            <mdt-cell>{{nutrition.sodium}}</mdt-cell>
            <mdt-cell>{{nutrition.calcium}}</mdt-cell>
            <mdt-cell>{{nutrition.iron}}</mdt-cell>
        </mdt-row>
    </mdt-table>
</div>
</body>

</html>

这是index3.js

(function(){
    'use strict';

    angular.module('exampleApp', ['ngMaterial', 'mdDataTable']);
    angular.module('exampleApp').controller('ExampleController', function($scope, $mdToast){

        $scope.nutritionList = [
            {
                id: 601,
                name: 'Frozen joghurt',
                calories: 159,
                fat: 6.0,
                carbs: 24,
                protein: 4.0,
                sodium: 87,
                calcium: '14%',
                iron: '1%'
            },
            {
                id: 602,
                name: 'Ice cream sandwitch',
                calories: 237,
                fat: 9.0,
                carbs: 37,
                protein: 4.3,
                sodium: 129,
                calcium: '84%',
                iron: '1%'
            },
            {
                id: 603,
                name: 'Eclair',
                calories: 262,
                fat: 16.0,
                carbs: 24,
                protein: 6.0,
                sodium: 337,
                calcium: '6%',
                iron: '7%'
            },
            {
                id: 604,
                name: 'Cupkake',
                calories: 305,
                fat: 3.7,
                carbs: 67,
                protein: 4.3,
                sodium: 413,
                calcium: '3%',
                iron: '8%'
            },
            {
                id: 605,
                name: 'Gingerbread',
                calories: 356,
                fat: 16.0,
                carbs: 49,
                protein: 2.9,
                sodium: 327,
                calcium: '7%',
                iron: '16%'
            },
            {
                id: 606,
                name: 'Jelly bean',
                calories: 375,
                fat: 0.0,
                carbs: 94,
                protein: 0.0,
                sodium: 50,
                calcium: '0%',
                iron: '0%'
            },
            {
                id: 607,
                name: 'Lollipop',
                calories: 392,
                fat: 0.2,
                carbs: 98,
                protein: 0,
                sodium: 38,
                calcium: '0%',
                iron: '2%'
            },
            {
                id: 608,
                name: 'Honeycomb',
                calories: 408,
                fat: 3.2,
                carbs: 87,
                protein: 6.5,
                sodium: 562,
                calcium: '0%',
                iron: '45%'
            },
            {
                id: 609,
                name: 'Donut',
                calories: 452,
                fat: 25.0,
                carbs: 51,
                protein: 4.9,
                sodium: 326,
                calcium: '2%',
                iron: '22%'
            },
            {
                id: 610,
                name: 'KitKat',
                calories: 518,
                fat: 26.0,
                carbs: 65,
                protein: 7,
                sodium: 54,
                calcium: '12%',
                iron: '6%'
            }
        ];
    });
}());

但是我遇到了这些错误：

        angular.js:29659 WARNING: Tried to load angular more than once.
md-data-table.min.css:1 Uncaught SyntaxError: Unexpected token {
md-data-table.css:1 Uncaught SyntaxError: Unexpected token {
md-data-table-style.css:2 Uncaught SyntaxError: Unexpected token {
angular.js:38 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=exampleApp&p1=Error…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.8%2Fangular.min.js%3A19%3A463)

其他人是librarybower组件。

那么，我做错了什么？我想看一个简单的表格。但我得到了错误。那些是它下载的库，为什么会出错？

我有很多图书馆，但我不会全部使用。 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /角 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /角动画 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /角咏叹调 /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/.bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/angular-aria.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/angular-aria.min.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/angular-aria.min.js.map /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/index.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/package.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-aria/README.md /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角材料 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角材料/演示 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角材料/模块 /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/.bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/.gitignore /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.layouts.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.layouts.min.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.min.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.min.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material.scss /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/angular-material-mocks.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/CHANGELOG.md /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/index.js /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角材料/许可 /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/package.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material/README.md /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角的材料数据表 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角的材料数据表/ DIST /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.min.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table.min.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/dist/md-data-table-style.css /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/.bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/bower.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/CHANGELOG.md /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/index.js /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/LICENSE.md /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/package.json /home/caneraydin/IdeaProjects/InternetMovieDatabase/src/main/resources/static/bower_components/angular-material-data-table/README.md /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角材料图标 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components /角度的消息 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /角嘲笑 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components /角的sanitize /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components / jQuery的 /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / src目录/主/资源/静态/ bower_components / lodash /家庭/ caneraydin / IdeaProjects / InternetMovieDatabase / SRC /主/资源/静态/ bower_components / mdDataTable

Answer 1

尝试将https：//放在角度链接前面

Answer 2

我的猜测是注射之一导致你错误...

angular.module('exampleApp', ['ngMaterial', 'mdDataTable']);
    angular.module('exampleApp').controller('ExampleController', function($scope, $mdToast){

可能是ngMaterial库没有被添加而你试图注入它...你可以检查一下......

我在那里看不到棱角分明的材料......

<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="bower_components/angular-material/angular-material.js"></script>
<script src="app.js"></script>

做一个凉亭安装角度材料--save你应该有依赖关系，然后你可以添加会引起错误的角度材料。

Answer 3

您能否在存储库中提出此问题？你可能会得到更快的答案！

http://iamisti.github.io/mdDataTable/

angular未定义（匿名函数）@ md-data-table.min.js：1

3 个答案: