Question

我是angular的新手，我正努力将我在控制器中检索到的变量通过http资源传递到我的指令中。首先，我有一个问题，我的ngResource调用是异步的，然后我有一个问题，我的资源调用是链接的。

这是我的HTML

<html ng-app="routingRulesApp">
<body ng-controller="RulesDisplayCtrl">
    <my-customer info="$activeRuleSetId"></my-customer>
</body>
</html>

这是我的Javascript

var routingRulesApp = angular.module('routingRulesApp', [
  'routingRulesControllers',
  'routingRulesServices',
  'routingRulesDirectives'
]);

var routingRulesControllers = angular.module('routingRulesControllers', []);

routingRulesControllers.controller('RulesDisplayCtrl', ['$scope', 'RuleSets', '$q',
    function($scope, RuleSets, $q) {

        var fr = null;
        var rpromise = $q.defer();

        $scope.activeRuleSetId = RuleSets.active({ruleId: 1}, function(activeRuleSetId) {

            var ruleSetId = activeRuleSetId[0];

            var ruleSet = RuleSets.query({ruleSetId: ruleSetId}, function(ruleSet) {

                console.log(ruleSet);
                fr = ruleSet;
                rpromise.resolve(fr);

            }, function(response) {
                //404 or bad
                if(response.status === 404) {
                    console.log("HTTP Error", response.status);
                }
            });


        }, function(response) {
            //404 or bad
            if(response.status === 404) {
                console.log("HTTP Error", response.status);
            }
        });

        $scope.formattedResults = rpromise.promise;

    }
]);

var routingRulesDirectives = angular.module('routingRulesDirectives', []);

routingRulesDirectives.directive('myCustomer', [
    function() {
        return {
            restrict: 'E',
            replace: true,
            scope: {
                formattedResults: '=info'
            },
            templateUrl: 'templates/currency-group-rule.html',
            controller: function($scope) {
                console.log($scope.formattedResults);
                debugger;

            }
        };
    }
]);

var routingRulesServices = angular.module('routingRulesServices', ['ngResource']);

routingRulesServices.factory('RuleSets', ['$resource',
    function($resource){
        return $resource('data/routing-ruleset-:ruleSetId.json', {}, {
            query: {method:'GET', isArray:true},
            active: {method:'GET', isArray: false, url: 'data/rulesets-activeRuleSetId.json', responseType:"text"}
        });
    }]);

我试图在我的指令控制器中获取我的$ scope.formattedResults变量，以便我可以构建自定义表/网格解决方案，但我不确定如何实现这一点。你可以看到我很迷茫。我试图使用延迟对象，并希望它将绑定到变量。

Answer 1

嗯，这不是代码答案，但我需要引导你一些角度方面。

实现目标：

您需要一个调用异步函数的控制器或服务（从控制器进行优先级调用和调用）。
使用async结果的指令。

我可以快速想到两种方式。

注入控制器和指令的服务（可能具有不同的范围）。完成异步调用后，两个作用域都将通过角度提供的数据绑定设置变量。
控制器由它自己拥有异步功能并共享范围或广播变量或者iherits等。

现在一些关键点，你不必忘记你的角度精神。

闭包。学习使用并做很棒的事情
Mutables。共享（赋值）一个不可变的变量（整数，字符串）不会有帮助。更具体：由于promise将值设置为值是可变的变量（例如dict），那么如果指令通过作用域访问该变量或者如所讨论的那样，当返回async promise时，如果你的指令将具有正确的值更新字典而不是重置它。注意这一点。

可能你知道他们中的大多数，并且肯定谷歌搜索会给你很多S.O.问题的内容可以解释上述内容，可能会更好。也许有人可以给你一些代码相关的答案。

如何将一个异步变量从控制器传递给angularjs中的指令

1 个答案: