4

だから私はEmberjsをチェックしています。

ホームページを少し下にスクロールして、「EMBER.JSの使用を開始するのは簡単です」と表示します。

素晴らしい、それは単純に見えます、私はそれをやってみます。

新しい定型HTML5ファイルを作成します。

テンプレートコードを私の：に貼り付けます

<body></body>

emberjsを含める：

<script src="ember.js" type="text/javascript"></script>

彼らが提供したJSコードを以下に含めます。

<script type="text/javascript"></script>

私の頭のタグの中で。素晴らしい、何が起こるか見てみましょう。

ページをロードすると、コンソールからjqueryが必要であると通知されます。したがって、jQueryを含めても問題ありません。もう一度やり直してください。別のエラーです。ハンドルバーを含める必要があります。問題ありません、私はハンドルバーを含めます。もう一度やり直してください、アプリは定義されていません...そうです...だから私は含めます

window.App = Ember.Application.create();

彼らが提供したスニペットの上。もう一度やり直してください。DSは定義されていません。この時点で、私は次にどこに行くべきかわかりません。どこかでDSモデルを定義する必要があると思うので、 emberjsガイドのセクションを見てみました。しかし、ガイドは役に立たなかった。

私は露骨に明白な何かを見逃していますか、それとも彼らが言っているようにこれは実際には「簡単」ではありませんか？この基本的な例を機能させるために私は何をしなければなりませんか（そしてなぜ彼らは例として箱をうまく機能させない「基本的な」コードを与えたのですか？）

編集：

これまでの私の完全なコード：

<!DOCTYPE html>
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
<script src="handlebars.js" type="text/javascript"></script>
<script src="ember.js" type="text/javascript"></script>
<script type="text/javascript">
window.App = Ember.Application.create();
App.Person = DS.Model.extend({
  firstName: DS.attr('string'),
  lastName: DS.attr('string'),

  fullName: function() {
    return this.get('firstName') +
           " " + this.get('lastName');
  }.property('firstName', 'lastName')
});

App.peopleController = Em.ArrayController.create({
  content: App.Person.findAll()
});
</script>
</head>
<body>
<h1>People</h1>

<ul>
{{#each peopleController}}
  <li>Hello, <b>{{fullName}}</b>!</li>
{{/each}}
</ul>
</body>
</html>
4

2 に答える 2

2

問題はあなたではありません。ドキュメントが必要な依存関係、ハンドルバーの命名規則をリストすることを怠り、コードを提供せずに突然Postコントローラーについて話し始めることです。また、認知的前方参照が少し行われている場所もいくつかあるので、EmberJについて知っている場合はガイドが理にかなっていますが、それを新鮮に学ぼうとしている場合は、飛び回って仮定を立てる必要があります。いくつかのテストを実施します。

これはEmberJSアプリケーションに必要な最小限のコードではありませんが、スタートガイドの約80％をプラグインするのに十分なはずです。お役に立てれば。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
<script src="jquery-1.9.1.js"></script>
<script src="handlebars.js"></script>
<script src="ember-1.0.0-rc.1.js"></script>
</head>
<body>


<script language="javascript" type="text/javascript">

  // Make a global variable -- http://emberjs.com/guides/application/
  App = Ember.Application.create({
    VERSION: '1.0.0',
    // store: Ember.Store.create().from(Ember.fixtures)
  });

  // http://emberjs.com/api/classes/Ember.Application.html
  App.ready = function() {
    // alert("App initialized!");
  };

  // Application Controller, extended with custom properties
  App.ApplicationController = Ember.Controller.extend({
    appName: 'My First Example',

    firstName: "Charlie",
    lastName: "Brown",

    // initial value
    isExpanded: false,

    expand: function() {
      this.set('isExpanded', true);
    },

    contract: function() {
      this.set('isExpanded', false);
    }
  });


  // A router
  App.ApplicationRoute = Ember.Route.extend({
    setupController: function(controller) {
      // `controller` is the instance of ApplicationController
      controller.set('title', "Hello world!");
    }
  });


</script>


<script type="text/x-handlebars" data-template-name="application">
  <header>
    <h1>A Header - {{appName}}</h1>
  </header>

  <div>
  Hello, {{firstName}} {{lastName}}.
  <p/>

  {{#if isExpanded}}
    <div class='body'>{{body}}</div>
    <button {{action "contract"}}>Contract</button>
  {{else}}
    <button {{action "expand"}}>Show More...</button>
  {{/if}}

  <hr/>
  {{outlet}}
  <hr/>


  </div>

  <footer>
    <H1>A Footer</H1>
  </footer>
</script>


</body>
</html>
于 2013-03-07T15:05:58.247 に答える
0

Ember Dataを含めていない限り、DSストアを定義する必要はありません。jsfiddleで利用できる最も基本的なEmber開始テンプレートがあります。レンダリングされたフレームのソースを表示して、アプリケーションが機能するために必要なJSファイルは3つ（すでに含まれている）であることがわかります。

そこからそれはあなた次第ですが、はい、最初から始めることに関してドキュメントが不足していることを認めます。

編集から、オブジェクトが参照されていますが、 EmberDataスクリプトDSは参照されていません。メインストリームがロックされているのに対し、APIロックされていないため、現在、デフォルトのEmberJSスクリプトへのアドオンです。

于 2013-02-11T11:57:06.920 に答える