3

特に angular/js 用語 (コントローラー、サービス、ファクトリーなど) に関しては、私の言葉遣いの一部がずれている可能性がありますが、それでも理解できることを願っています。また、この質問には複数の部分があるため、1 行で質問するのが困難でした。

newRegistration.html、Registration.js、およびaddressVerification.jsの3 つのファイルがあります。

newRegistration.htmlには、ユーザーが自分のメールアドレス、電話番号、郵送先住所などを入力して「次へ」をクリックするフォームがあります。[次へ] をクリックすると、Registration.js (コントローラー?) がトリガーされます (?)。

newRegistration.html

次のスニペットは、addressVerification.jsng-repeatからの新しいデータで更新したいものです。

<div id="dialog-form" title="CHOOSE THE CORRECT ADDRESS">
    <ul>
        <li ng-repeat="for item in [not sure what to put here because of two js files]">

        </li>
    </ul>    
</div>

登録.js

上記を含むテンプレートのコントローラーng-repeat。

一番上の行は次のようになります。

angular.module('appname')
    .controller('RegistrationCtrl', function ($scope, $http, cacheStore, countryStates, birthYear, $anchorScroll, errorMessages, addressVerification, UtilsFactory)

そして、これは関連するかもしれない行です:

addressVerification.verify(user).then(function (userObj)

addressVerification.js

Smartystreets API を使用して、郵送先住所を修正/提案します。

newRegistration.htmlng-repeatにデータを入力するために、このモジュールから Registration.js (スコープ変数 [?] がある場所) に変数を渡す方法がわかりません。

angular.module('appname').factory('addressVerification', function($q, userIdentity, $http,  smartyToken) {
    "use strict";

    return {
    verify: function(obj) {
        var deferred = $q.defer(),
        street2QS = "";

    if (obj.address2 || obj.address2 !== "") {
        street2QS = "&street2=" + encodeURIComponent(obj.address2);
    }

$http.jsonp("https://api.smartystreets.com/street-address?street=" + encodeURIComponent(obj.address1)
    + street2QS
    + "&city=" + encodeURIComponent(obj.city)
+ "&state=" + encodeURIComponent(obj.state)
+ "&zipcode=" + encodeURIComponent(obj.zip)
+ "&source=website&auth-token="+ smartyToken.get() + "&candidates=5&callback=JSON_CALLBACK")
.success(function (response) {
    var metaData,
    components;

        if (response && response.length === 1) {
        metaData = response[0].metadata || {};
        components = response[0].components || {};

            angular.extend(obj, {
        "address1": [
            components.primary_number,
        components.street_name,
        components.street_suffix
                    ].join(" "),
        "address2": [
        components.secondary_designator,
        components.secondary_number
        ].join(" "),
        "city": components.city_name,
        "county_name": metaData.county_name,
        "county_fips": metaData.county_fips,
        "state": components.state_abbreviation,
        "latitude": metaData.latitude,
        "longitude": metaData.longitude,
        "plus4_code": components.plus4_code,
        "zip": components.zipcode
        });
        deferred.resolve(obj);
        } else {
            deferred.reject(false);
        }
        }).error( function() {
            deferred.reject(false);
        });

        return deferred.promise;
    }
    };
});

私は今かなり無知です。必要な詳細をすべて提供したと思います。どこから始めればいいのか知りたいです。遅延オブジェクト、ng-repeat、およびコントローラーについてすべて読みましたが、混乱しています。

どんな助けでも感謝します。

4

2 に答える 2

1

addressVerification を RegistrationCtrl に挿入しています。RegistrationCtrl に注入される addressVerification の値は、ここで定義している関数を実行することによって返される値です。

angular.module('appname')
.factory('addressVerification', function($q, userIdentity, $http, smartyToken)

したがって、その関数で返されるものにメソッドを追加することで、RegistrationCtrl.js ファイルの addressVerification.js ファイル内で発生しているものにアクセスできます。

RegistrationCtrl にデータを取得したら、RegistrationCtrl 内のスコープにデータを追加することで、ビューからデータにアクセスできます。例：

これは、RegistrationCtrl.js に入ります。

$scope.someItems = [1, 2, 3, 4];

これは次のように表示されます。

<li ng-repeat="item in someItems">{{item}}</li>
于 2014-04-20T00:53:46.403 に答える
1

これを実装した方法は、それに依存するコントローラー (およびコントローラーのビュー) が同じファクトリー内に値を格納できるようにするファクトリーのメソッドを公開することです。

たとえば、次のコードではsetCurrent、ファクトリのメソッドがcustomersファクトリに値を格納しますcurrent。ファクトリはシングルトンであるため、アプリケーションに保持されます。<a>ユーザーが(次の例で) をクリックして に移動した後でも、同じファクトリが両方のコントローラーの依存関係である場合、href="/"に格納された値customers.currentは "/" ルートのコントローラーにアクセスできます。

テンプレート

<ul>
    <li>{{customers.current.name}}</li>
    <li 
        ng-repeat="customer in customers.all"
        >
        <a 
            class="action name"
            ng-click="customers.setCurrent(customer)"
            href="/"
            >
            {{customer.name}}
        </a>
    </li>
</ul>

コントローラ

angular
.module('CtrlCustomerList', [
    'CollectionCustomers',
])
.controller('CtrlCustomerList', function($scope, CollectionCustomers) {
    $scope.customers = CollectionCustomers;
});

工場

angular
.module('CollectionCustomers', [
])
.factory("CollectionCustomers", function(Restangular, ModelCustomer, $location) {
    return {
        all     : [],
        current : null,
        setCurrent : function() {
            // Affect this.current
        }
    }
});
于 2014-04-20T01:48:06.053 に答える