CODEWITHSUNDEEP
angularjscordovamaterial-designionic-framework
Craig R
Craig R

Reputation: 1

Angular and Ionic Issues

I'm having a few issues with setting this combination up, things such as md-slider and md-checkbox won't show up on my page. The "Yes" and "No" are clickable as if they were a checkbox but the box won't show.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.7.0/angular-material.min.css">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="cordova.js"></script>
    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-animate.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-aria.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.7.0/angular-material.min.js"></script>
    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Ionic Blank Starter</h1>
      </ion-header-bar>
      <ion-content>
        <md-card>
          <md-checkbox>
            Yes
          </md-checkbox>
          <md-checkbox>
            No
          </md-checkbox>
        </md-card>
      </ion-content>
    </ion-pane>
  </body>
</html>

Upvotes: 0

Views: 171

Answers (1)

Gaurav Sarma
Gaurav Sarma

Reputation: 2297

  1. First of all remove all the dependencies from the body tag and move it inside head tag.

  2. You need to include the cordova.js and app.js after all the angular reference

  3. Please remember to keep ionic.bundle.js above all the js

Upvotes: 1

Related Questions