$ stateProvider在Angularjs + Ionic中无法正常工作

时间:2014-11-14 07:43:31

标签: angularjs cordova ionic-framework

我有生成器离子的脚手架离子项目,并创建了一个空白项目。我试图添加状态,但应用程序不会加载在任何州中定义的模板。

这是我的app.js

'use strict';
    angular.module('IonicCarOPedia', ['ionic'])
    .run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
  });
})
  .config(function ($stateProvider, $urlRouterProvider) {

    $stateProvider

      .state('main', {
        url: '/main',
        templateUrl: 'view/main-view.html',
        controller:'MainCtrl1'
      });

    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise('/main');

  })

.controller('MainCtrl1', function(){
    console.log("main ctrl alled")
  });

这是index.html:

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

    <link rel="stylesheet" href="lib/ionic/release/css/ionic.css" />

    <link rel="stylesheet" href="styles/main.css">
  </head>

  <body ng-app="IonicCarOPedia">

    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular-animate/angular-animate.js"></script>
    <script src="lib/angular-sanitize/angular-sanitize.js"></script>
    <script src="lib/angular-ui-router/release/angular-ui-router.js"></script>
    <script src="lib/collide/collide.js"></script>
    <script src="lib/ionic/release/js/ionic.js"></script>
    <script src="lib/ionic/release/js/ionic-angular.js"></script>
    <script src="cordova.js"></script>

            <script src="scripts/app.js"></script>    

    <nav-bar type="bar-positive"
             animation="nav-title-slide-ios7"
             back-button-type="button-icon"
             back-button-icon="ion-ios7-arrow-back"></nav-bar>

    <nav-view></nav-view>
</body>
</html>

和main-view.html:

<view title="'Employees'">

  <div class="bar bar-subheader item-input-inset">
    <label class="item-input-wrapper">
      <i class="icon ion-ios7-search placeholder-icon"></i>
    </label>
  </div>

</view>

我做的模板没有显示,甚至没有调用MainCtrl1。

感谢任何帮助。感谢

1 个答案:

答案 0 :(得分:0)

好吧好像有些愚蠢的错误,但我之前尝试过它从来没有奏效,但它现在正在运作。

我已将离子元素更改为:nav-barion-nav-barnav-viewion-nav-viewviewion-view,现在已有效。< / p>