2

我有加载 angular-material 的问题,我已经用 jspm 安装了它。通过 Systemjs。

我总是收到:

未捕获的异常:未找到: http://localhost:8080/jspm_packages/github/angular/bower-material@0.10.0/angular-material

这是我的 Systemjs 配置,由 jspm 创建

System.config({
  "baseURL": "/",
  "transpiler": "traceur",
  "paths": {
    "*": "*.js",
    "github:*": "jspm_packages/github/*.js"
  }
});

System.config({
  "map": {
    "angular": "github:angular/bower-angular@1.4.3",
    "angular-animate": "github:angular/bower-angular-animate@1.4.3",
    "angular-aria": "github:angular/bower-angular-aria@1.4.3",
    "angular-material": "github:angular/bower-material@0.10.0",
    "traceur": "github:jmcriffey/bower-traceur@0.0.88",
    "traceur-runtime": "github:jmcriffey/bower-traceur-runtime@0.0.88",
    "github:angular/bower-angular-animate@1.4.3": {
      "angular": "github:angular/bower-angular@1.4.3"
    },
    "github:angular/bower-angular-aria@1.4.3": {
      "angular": "github:angular/bower-angular@1.4.3"
    },
    "github:angular/bower-material@0.10.0": {
      "angular": "github:angular/bower-angular@1.4.3",
      "angular-animate": "github:angular/bower-angular-animate@1.4.3",
      "angular-aria": "github:angular/bower-angular-aria@1.4.3",
      "css": "github:systemjs/plugin-css@0.1.13"
    }
  }
});

这是我的 Mainjs:

var angular = require("angular");
require("angular-material");
var app = angular.module('StarterApp', ["ngMaterial"]);

我在我的 index.html 中加载:

<script>
    System.import("Main");
</script>

这有什么问题

4

1 回答 1

0

一定是您的配置中的错误。这是迄今为止的程序(2016/02),示例取自此处

第一的 : jspm install angular angular-animate angular-aria angular-material

window.define = System.amdDefine;
window.require = window.requirejs = System.amdRequire;

require([
  'angular',
  'angular-aria',
  'angular-animate',
  'angular-material',
  'angular-material/angular-material.css!',
  'angular-material/angular-material.layouts.css!'
], function(angular) {
  var app = angular.module('App', ['ngMaterial', 'ngAnimate', 'ngAria']);

  app.controller('AppCtrl', ['$scope',
    function($scope) {
      $scope.title = document.title;
    }
  ]);

  // angular manual initialisation since we use a script loader
  // cf. http://docs.angularjs.org/guide/bootstrap
  angular.element(document).ready(function() {
    console.log('Bootstrapping angular...');
    angular.bootstrap(document, ['App'], {
      strictDi: true
    });
  });
});
<!DOCTYPE html>

<head>
  <meta charset="utf-8" />
  <title>Angular Material</title>
  <script src="jspm_packages/system.js"></script>
  <script src="config.js"></script>
  <script>
  </script>
</head>

<div class="contentdemoBasicUsage" ng-controller="AppCtrl" layout="column" ng-cloak="">
  <md-toolbar class="md-warn">
    <div class="md-toolbar-tools">
      <h2 class="md-flex">{{title}}</h2>
    </div>
  </md-toolbar>

  <md-content flex="" layout-padding="">
    <p>Lorem ipsum dolor sit amet, ne quod novum mei. Sea omnium invenire mediocrem at, in lobortis conclusionemque nam. Ne deleniti appetere reprimique pro, inani labitur disputationi te sed. At vix sale omnesque, id pro labitur reformidans accommodare,
      cum labores honestatis eu. Nec quem lucilius in, eam praesent reformidans no. Sed laudem aliquam ne.</p>

    <p>
      Facete delenit argumentum cum at. Pro rebum nostrum contentiones ad. Mel exerci tritani maiorum at, mea te audire phaedrum, mel et nibh aliquam. Malis causae equidem vel eu. Noster melius vis ea, duis alterum oporteat ea sea. Per cu vide munere fierent.
    </p>
  </md-content>
</div>

于 2016-02-17T22:48:35.813 回答