3

Ember0.9.7.1を使用する

アプリが起動して最初の状態に入ると、IE8以下でこのエラーが発生します。私はかなり大きなアプリを持っているので、jsFiddleで再現できるかどうかはわかりませんが、以下に関連するビットを示します。

私はGitHubでこれらの同様の問題を見てきましたが、どちらも私が間違っていることを正確に説明しているとは思いません(それは私である必要があります...そうですか?:))

https://github.com/emberjs/ember.js/issues/752
https://github.com/emberjs/ember.js/issues/447

私のアプリの初期ビューは、次のように状態マネージャーによって作成/ロードされます。

SYOS.stateManager = Em.StateManager.create({

    enableLogging: true,
    rootElement: #syos-root,
    initialState: 'noSectionSelected',

    noSectionSelected: Ember.ViewState.create({

        view: SYOS.SelectSectionView,

        chooseSection: function (manager, context) {

            manager.goToState('sectionSelected');

        }

    }),
<snip>

そのビューは基本的に次のように定義されます。

SYOS.SelectSectionView = Em.View.extend({

templateName: 'selectSectionView',
sectionsBinding: 'SYOS.sectionController.sections'
});

テンプレートの簡略版は次のようになります。

<script type="text/x-handlebars" data-template-name="selectSectionView">

<h2>Some markup</h2>

<table class="select-sect" cellspacing="0">
{{#each sections}}
    {{#view SYOS.SelectSectionRowView sectionBinding="this" tagName="tr"}}
    <td class="sect">{{section.name}}</td>
    {{/view}}
{{/each}}
</table>

</script>

このテンプレートは、それが役立つ場合は、私のhtmlで直接定義されています。

ページをロードすると、コンソールログに次のように表示されます。

ログ:STATEMANAGER:noSectionSelectedと入力します
SCRIPT438:オブジェクトはこのプロパティまたはメソッドをサポートしていません
ember-0.9.7.1.min.js、10行目文字30680
SCRIPT5022:DOMにないMetamorphで操作を実行できません。
ember-0.9.7.1.min.js、13行目文字29412
SCRIPT5022:例外がスローされ、キャッチされませんでした
ember-0.9.7.1.min.js、13行目文字16607

IEのデバッガー(eww)を使用して最初のエラーを中断すると、#eachmetamorphタグでエラーが発生しているように見えることがわかります。それはこの行で壊れます:

g.prototype.checkRemoved=function(){if(this.isRemoved())throw new Error("Cannot perform operations on a Metamorph that is not in the DOM.")}

this.isRemoved()がtrueを返しているためです。デバッガーthisで調べると、this.start=="metamorph-6-start"であることがわかります。動作中のブラウザでそのメタモルフタグを検索すると#each、テンプレートのブロックの開始タグであるように見えます。

sectionBindingは、jQuery .ajax呼び出しから読み込まれる配列であるため、最初は[]になりthis.get('sections').pushObject(section);、コントローラーでajax呼び出しの結果をループしながらを使用してデータが入力されます。

この状態では、動的ビューの追加や削除は行っていません。ビューをロードし、セクションがajaxサービス呼び出しから戻ってきたときにセクションをバインドする必要があります。

誰かが親切にこれについて正しい方向に私を向けることができますか?ありがとう!

編集:Ember 0.9.8.1に更新され、コンソールでのエラーが1つ少なくなりました。

ログ:STATEMANAGER:noSectionSelectedと入力します
SCRIPT5022:DOMにないMetamorphで操作を実行できません。
ember-0.9.8.1.min.js、14行目文字4051
SCRIPT438:オブジェクトはこのプロパティまたはメソッドをサポートしていません
ember-0.9.8.1.min.js、10行目文字31677
4

4 に答える 4

11

これをフォローアップして、これを解決するために私がしなければならなかったことをグーグルに提供します。

つまり、ビューをアプリに追加する方法を完全に作り直すことで、これを解決しました。

Emberアプリで奇妙なことを経験している人は、デバッグバージョンのEmberを使用してアプリを実行することを強くお勧めします。コンソールで提供されるアサーションとフィードバックは非常に貴重です。

私は実際に2つの問題が起こっていました:

1)#each上記のテーブルを作成するで#each、バインドされたハンドルバーヘルパー(http://codebrief.com/2012/03/eight-ember-dot-js-gotchas-with-workaroundsにあります)を使用した別のテーブルがありました/そして非常に、非常に便利です)。

これは非常に深くネストされていたので、私はバインドされたヘルパーを使用して呼び出す必要が{{ boundHelper this}}ありました。Chrome、Firefox、およびIE9は、これを妨げているようには見えませんでした。理由はわかりません。しかし、基本的にバインドされたヘルパーを使用すると、normalizePathにthisaが渡され、このアサーションが失敗します。''

function normalizePath(path) {
  Ember.assert('must pass non-empty string to normalizePath()', path && path!=='');

この問題を回避するには、boundHelperを値の配列または単一の値のいずれかで機能するように変更し、{{boundHelper colors}}を使用するのではなく、ヘルパーとして記述してループできるようにし#eachました。

2)つまり、1つの問題が発生しますが、元のメタモルフエラーが発生します。他のエラーがクリアされたので、メタモルフエラーがまったく別のビューから発生していることがわかりました。

#viewヘルパーを使用してHTMLで定義された2つのネストされたビューがありました。どういうわけか、ネストされたビューが親を再レンダリングさせていました。繰り返しになりますが、Emberのデバッグビルドは、コンソールにメッセージを記録するため、これを追跡するための優れたツールでした。

なぜこれがこのような問題なのかは100%わかりませんが、再レンダリング中にメタモルフタグが存在せず、問題が発生するようです。これはEmberのバグである可能性があるように見えますが、「Emberの方法」で何かをしていなかった可能性がさらに高くなります。エンバーと同じように、足を撃ち落とすのも簡単です:)

最終的に、これらのインラインビューをHandlebarsテンプレートに作成し、EmberApp.ready関数でビューをDOMに追加しました。これによりすべてのエラーがクリアされ、IE7および8でエラーなしでアプリをレンダリングできるようになりました。

于 2012-05-24T21:48:19.100 に答える
7

HTMLコメント内にいくつかのハンドルバーコードを発見したときに、この問題を解決しました。問題のあるコードは、削除されたか、次のようなハンドルバーのコメントにラップされている可能性があります。

{{!--
    <h1>{{myTitle}}</h1>
--}}
于 2013-07-19T05:14:56.917 に答える
5

私たちがやろうとしていたので、私はこの問題に遭遇しました:

<input size="16" type="text" valueBinding="{{deadline}}">

実際にそうあるべきだったとき:

<input size="16" type="text" {{bindAttr valueBinding="deadline"}}>
于 2013-07-10T16:26:29.860 に答える
0

私は今日これに遭遇し、私の経験が他の誰かを助けることを望んでいます。同じエラーメッセージが表示され、コメントアウトされたハンドルバーコードをすべて削除し、この参照を明示的な#eachオブジェクト名に変更した後、何も機能しませんでした。

#withと#eachを複数回ネストすると、ビューが少し不安定になる可能性があることがわかります。

{{#with view.content.project as project}}
    //set some project fields
    {{#each job in project.jobs}}
        {{#with job}}
            // set job some fields
        {{#/with}}
        {{#each task in job.tasks}}
            {{#with task}}
                // set tasksome fields
            {{#/with}}
        {{/each}}
    {{/each}}
{{/with}}

私たちが発見したのは、最初の#eachの直前に(#with view.content.project as project)を使用してプロジェクトを終了すると、エラーが解消されたことです。なぜそれが問題だったのかはわかりませんが、おそらくこれは他の誰かが同じ問題と戦うのに役立つでしょう。

動作するコード:

{{#with view.content.project as project}}
    //set some project fields
{{/with}}
{{#each job in project.jobs}}
    {{#with job}}
        // set job some fields
    {{#/with}}
    {{#each task in job.tasks}}
        {{#with task}}
            // set tasksome fields
        {{#/with}}
    {{/each}}
{{/each}}
于 2013-12-10T23:03:47.163 に答える