小编Ted*_*ino的帖子

使用materializecss和aurelia

我想询问是否有一步一步的方法来使用或配置与Aurelia的materializecss.我目前能够运行我的Aurelia应用程序,直到我的index.html看起来像这样的教程:

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8" />
   <link href="jspm_packages/github/dogfalo/materialize@0.97.0/dist/css/materialize.css" rel="stylesheet" />
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <title></title>
</head>
<body aurelia-app>
   <script src="jspm_packages/system.js"></script>
   <script src="config.js"></script>
   <script>
      System.import('aurelia-bootstrapper');
   </script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

我目前正在使用ASP .NET 5 Preview空模板和jspm来安装Aurelia.我已经安装了materializecss jspm install github:dogfalo/materialize并从这个链接复制了一些HTML代码来测试它是否有效.

这段代码进入了我的app.html文件

<template>
<ul class="collapsible" data-collapsible="accordion">
    <li>
        <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
        <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
        <div class="collapsible-header"><i class="material-icons">place</i>Second</div>
        <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
        <div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
        <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
</ul>
</template>

Run Code Online (Sandbox Code Playgroud)

而我的app.html文件有这个测试