javascript - 在 Controller 之间传递变量并在同一页面上使用 ng-repeat

Question

我的一些措辞可能有误，尤其是关于 Angular/js 术语( Controller 、服务、工厂等)，但希望它仍然是可以理解的。另外，这个问题有多个部分，很难一口气问完。

我有 3 个文件:newRegistration.html、Registration.js 和 addressVerification.js。

在 newRegistration.html 中，有一个表单，用户可以在其中输入他/她的电子邮件、电话、邮寄地址和其他内容，然后单击“下一步”。点击下一步后，Registration.js(一个 Controller ？)被触发(？)。

newRegistration.html

在以下代码段中是我想用来自 addressVerification.js 的新数据更新的 ng-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>

Registration.js

包含上述 ng-repeat 的模板 Controller 。

顶行看起来像这样:

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 更正/建议邮寄地址。

我不知道如何将变量从这个模块传递到 Registration.js(作用域变量 [?] 所在的位置)以便在 newRegistration 中填充 ng-repeat .html。

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 和 Controller 的内容，但它让我感到困惑。

感谢任何帮助。

Answer 1

您正在将 addressVerification 注入(inject) RegistrationCtrl。注入(inject) RegistrationCtrl 的 addressVerification 值是执行您在此处定义的函数返回的值:

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

因此，您可以通过向该函数返回的任何内容添加方法来访问 RegistrationCtrl.js 文件中 addressVerification.js 文件内部发生的内容。

在 RegistrationCtrl 中拥有数据后，您可以通过将数据附加到 RegistrationCtrl 内的范围来从 View 访问它。示例:

这将进入 RegistrationCtrl.js:

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

这将进入 View :

<li ng-repeat="item in someItems">{{item}}</li>