如何將異步變量從控制器傳遞給angularjs中的指令

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

好吧，這不是代碼來回答這個問題，但是我需要向您介紹一些角度方面的內容。

為了實現您的目標：

您需要一個調用異步函數的控制器或服務（從該控制器提供並調用）。
使用異步結果的指令。

我可以很快想到兩種方法。

服務注入到控制器和指令（可能具有不同的范圍）。 完成異步調用后，兩個作用域都將通過angular提供的數據綁定設置變量。
控制器本身具有異步功能並共享作用域或廣播變量或繼承等。

現在，您不必忘記一些關鍵點角力。

閉包。 學習使用並做一些很棒的事情
Mutables。 共享（分配）不可變的變量（整數，字符串）將無濟於事。 更具體地說：由於promise為變量設置了一個值，該值是可變的（例如，dict），則如果該指令可以通過作用域訪問或如所討論的那樣訪問該變量，則在返回異步promise時，您的指令將具有如果更新字典而不重置它，則為正確的值。 注意這一點。

大概您知道其中大多數，並且可以肯定地使用Google搜索來解決許多SO問題，這些問題的內容可以解釋上述內容，並且可能會更好。 也許有人也可以給您一些與代碼相關的答案。

祝好運。

如何將異步變量從控制器傳遞給angularjs中的指令

問題描述

1 個解決方案

解決方案1
1 已采納 2014-02-07 18:24:32

如何將異步變量從控制器傳遞給angularjs中的指令

問題描述

1 個解決方案

解決方案1 1 已采納 2014-02-07 18:24:32

解決方案1
1 已采納 2014-02-07 18:24:32