2

注：私のアプリケーションははるかに複雑ですが、問題の核心に焦点を当てる必要のないものはすべて削除しています。その（簡略化された）アプリケーションを使用すると、ユーザーはアイテムに関するデータを編集できます。たとえば、ランダムな数の会社を追加し、それぞれに資格があります（メーカー、ディストリビューター、ホールセラーなど）。

そのアイテムオブジェクトは次のようになります。

{   // item
    Name: "name",
    CreationDate: "some date",
    // etc...
    Companies: [{ 
        Type: "Manufacturer",
        Company: {
            ID: "some random id",
            Name: "name of the company"
            // other bunch of stuff
            }
        // other bunch of stuff
        }, { 
        Type: "Distributor",
        Company: {
            ID: "some other random id",
            Name: "name of an other company"
            // other bunch of stuff
            }
        // other bunch of stuff
        }]
    // other bunch of stuff
}

私のangularjsアプリケーションには、さまざまな$ resourceオブジェクトファクトリ（たとえば、Companies、Items）があります。これらのファクトリは、すべてのオブジェクトの編集を担当するコントローラー（CompaniesController、ItemsControllerなど）に注入されます。

これで、（データベースで手動で作成した）アイテムを編集しているときに、そのアイテムをリソースオブジェクト（予期されたもの）として取得し、すべてのアイテムの会社をオブジェクトの配列として取得します。

また、利用可能なすべての企業をリソースオブジェクトの配列として別の呼び出しで取得しています（これも予想されます）。

会社オブジェクトの構造は、どちらの場合もまったく同じであることに注意してください（実際には同じオブジェクトであるため）。

私の問題は、アイテムのカテゴリがプレーンなJSオブジェクトであり、対応するangularsjsリソースにリンクまたはマップされていないため、既存のリンクされた会社を編集しようとしても、Angularがそれを見つけられないことです。一方では「基本的な」jsオブジェクトがあり、他方では$ resourceオブジェクトがあるので、論理的に思えます。

このページのエディションは、実際には会社のタイプの1つのフリーテキストフィールドと、すべての会社のドロップダウンリスト（選択）で作成されています。私は最初にselectでng-optionsを使用してみましたが、次に次のように回避しました。

<select name="ddlc_01" id="ddlc-01"> 
    <option value="">-- Choose --</option>
    <option ng-selected="company.ID == editedCompany.Company.ID" ng-repeat="company in companies" value="{{company.ID}}">{{company.Name}}</option>
</select>

しかし、私はそれをそのようにハックしたくありません。

では、jsオブジェクトを一致する$ resourceオブジェクトに「リンク」または「アタッチ」する方法はありますか？または、問題がangularjsに依存するのではなく、javascriptエンジンがオブジェクトを比較する方法に依存するため、ハックに固執していますか？

私はすべてのアイテムの会社を取り、それらを次のものに置き換えようとしました：

var item = Items.get({ verb: $routeParams.ID }, function (result) {
    var newComps = [];
    for (var i = 0; i < item.Companies.length; i++) {
        var ct = item.Companies[i];
        ct.Company = new Companies(ct.Company);
    }
});

しかし、それが$ resourceオブジェクトになったとしても、Companiesリクエストのオブジェクトとは一致しません。

私が検討していたがまだ試していなかったもう1つのオプションは、リクエストを「チェーン」し、オブジェクトID（オブジェクトのフィールド）に基づいて、Companiesから一致するリソースを検索し、それらをそれらのオブジェクトに置き換えることです。このオプションで私が気に入らないのは、すべてを設定するためにAPIのさまざまなメソッドへの呼び出しが実際にすでに4つあるため、ページの読み込みと構築の時間が長くなることです。

質問に対する考え、提案、回答はありがたいです:)

4

1 に答える 1

0

OKだから私は実際にそれをそのように解決しました：

  1. 現在応答されていないリクエストを取得するためのカウンターを作成しました
  2. すべてのObject.query（）に渡される関数'asyncCallback'を追加しました
  3. その方法では、カウンターをデクリメントします。
  4. カウンターが0に等しい場合は、アイテム会社を検索し、それらを「真の」値に置き換えます。

これにより、同じレベルの柔軟性を維持しながら、非同期呼び出しの連鎖を回避することができました（それ以上ではない場合）。また、必要が生じた場合は、ユーザーがUIで間違った選択をしないように、まだ「再バインド」されていないゾーンをフリーズするように簡単に変換できます。

私はそれで少し苦労したので（そしてドキュメントは私が望むほど明確に見えませんでした）、これが私が使用した選択です：

<select ng-options="c as c.Name for c in companies" ng-model="editedCompany.Company"> 
    <option>-- Choose --</option>
</select>

これは、会社の表現としてc.Nameを使用していることを意味しますが、その値は実際には会社自体です（値を信頼しないでください。これは、Angularが処理できるようにするための偽の値です）。

アイデアを提案したり、私が見落としているかもしれない懸念や間違いを提起したり、新しい答えを提供したりしてください！

于 2012-12-09T15:29:08.130 に答える