0

私はイオンを搭載したスマートフォン用の流星アプリに取り組んでいます。

残念ながら、背景色と戻るボタンを示す ionic のボイラープレート コードは、私のサイトの一部に表示され、一部のサイトには表示されません。

私にはランダムに見えますが、そうではないかもしれません。

すべてのテンプレートで ionic テーマを表示するにはどうすればよいですか?

プロジェクトの詳細とこれまでに試したことの説明が続きます......

これが私のパッケージのリストです：

aldeed:collection2       2.3.1* Automatic validation of insert and update operations on the client and server.
anti:i18n                0.4.3  Internalization: simplest package
fourseven:scss           2.0.1_5* Style with attitude. Sass and SCSS support for Meteor.js (with autoprefixer and sourcem...
iron:router              1.0.9  Routing specifically designed for Meteor
mdg:reload-on-resume     1.0.4  On Cordova, only allow the app to reload when the app is resumed.
meteor-platform          1.2.2  Include a standard set of Meteor packages in your app
meteoric:autoform-ionic  0.1.5  Ionic theme for Autoform
meteoric:ionic           0.1.17  Ionic components for Meteor. No Angular!
meteoric:ionic-sass      0.1.9  Ionic's CSS Framework in SASS and bundled for Meteor.
meteoric:ionicons-sass   0.1.6  Ionic's Ionicons library in SASS and bundled for Meteor.
spacebars                1.0.6  Handlebars-like template language for Meteor

これは、私が行ったテストの説明と問題に関するスクリーンショット です: 「about」という名前のテンプレートの場合、イオンテーマが表示されます。テンプレート コードを about2.html という名前のファイルにコピーし、テンプレートに about2 という名前を付けました。about2 という名前のルートを追加しました。その結果、about.html ionic では期待どおりに動作しましたが、about2.html ではそうではありませんでした。

含まれているcssファイルを確認しましたが、両方のページで同じでした。

JavaScript によって生成された html コードが異なっていました。

私のaboutテンプレートのコードは次のとおりです。

    <template name="about">

    {{#contentFor "headerButtonLeft"}}
        <div class="buttons">
            {{>myIonBackButton path="main" }}
        </div>
    {{/contentFor}}


    {{#contentFor "headerTitle"}}
        <h1 class="title">{{i18n 'about.title'}}</h1>
    {{/contentFor}}

    {{#ionView}}
        {{#ionContent}}
            <p>
                {{i18n 'about.content'}}

                Hello world

                {{i18n 'backButton'}}
            </p>
        {{/ionContent}}
    {{/ionView}}
</template>

ルートを設定する方法は次のとおりです。

Router.map(function(){

  /*Main menu*/

  this.route('about');
  this.route('about2');


});

ここに私が抱えている問題を示すスクリーンショットがあります: about ルート ここに画像の説明を入力

about2 ルート ここに画像の説明を入力

私も試しました：

  • 私の問題に関して正しい方法を知らずに流星デバッグでアプリケーションをデバッグするには
  • meteor resetでアプリケーションをリセットするには
  • アプリケーションを Android アプリとして実行するには

すべてのビューでレイアウトが適切に表示されないのはなぜですか?

4

1 に答える 1

0

routes.js ファイルを書き直して問題を解決しました。

デフォルトのレイアウトは設定されていません。

Router.configure({
  layoutTemplate: 'appLayout'
});

私にとってまだ紛らわしいのは、設定されていない場合に、イオンが時々レイアウトを表示した理由です。

私は最初にこのチュートリアルに従いましたが、2013 年のものであり、古すぎるようです。また、#meteor の zerovapor が教えてくれたように、Router.map がまだサポートされているかどうかは不明です。したがって、この後のチュートリアルで指定されているように、Iron-Router を使用します。

于 2015-07-14T21:05:17.573 に答える