AngularJS如何通过$rootScope获取数据到控制器？

Question

我正在开发一个移动应用程序，但在将数据传输到控制器时遇到了问题。我所做的是我从服务中获取数据并且效果很好（路由时这是'/'或根目录）：

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

listdnModule.factory('getActiveDnService', ['$http', function ($http) {
    return {
        getActiveDnSvc: function (izvajalecID) {
            return $http({ method: 'POST', url: 'svc.aspx/getActiveDN', data: "{'izvajalecID':" + "'" + izvajalecID + "'}", cache: true });
        }
    };
}]);

listdnModule.controller('listdnCtrl', ['$scope', '$http', 'getActiveDnService','$rootScope', function ($scope, $http, svc, $rootScope) {
    $scope.mjav = 1;
    svc.getActiveDnSvc($scope.mjav).success(function (data) {
        $rootScope.dnlist = data.d;
        $scope.listdn = data.d;
    });
}]);

所以这很好用。它将数据设置到 rootScope 和 localscope 并从本地范围读取。

然后我将 Costumers 列表链接到costumerdetail。路由设置是这样的：

mSvc.config(['$routeProvider',
  function ($routeProvider) {
      $routeProvider.
        when('/', {
            templateUrl: 'tmpl/listdn.html',
            controller: 'listdnCtrl'
        }).
        when('/settings', {
            templateUrl: 'tmpl/nastavitve.html',
            controller: 'settings'
        }).
        when('/dndetail/:dnid', {
            templateUrl: 'tmpl/dndetail.html',
            controller: 'dndetailCtrl'
        }).
        otherwise({
            redirectTo: '/'
        });
  }]);

在我尝试获取 dndetail 之后出现错误。我从 $routeParams 获得了正确的 ID，但我没有在正确的时间获得数据。代码是这样的：

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

dndetail.controller('dndetailCtrl', ['$rootScope', '$scope', '$routeParams', function ($rootScope, $scope, $routeParams) {
    console.log($rootScope.dnlist[0]);
    $scope.datal = $rootScope.dnlist;
    $scope.id = $routeParams.dnid;
    for(var i = 0; i <= datal.length; i++) {
        if (datal[i].ID === $scope.id) {
            $scope.data = datal[i];
        }
    }
}]);

这是我得到的错误：

如您所见，console.log 获取对象并打印输出（我将其屏蔽，因为它是公司数据），而 datal 未定义。 chrome DevTools 中特殊的 AngularJS 选项卡也显示数据存在：

最后是没有获取数据的视图模板：

<ul ng-controller="dndetailCtrl" class="list-group">
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Naslov</div>
            <div class="pull-right">
                <a ng-href="https://maps.google.com/?q={{ data.Ulica }} {{ data.Posta }} {{ data.Kraj }}">
                    {{ $root.dnlist[1].Ulica }}<br />
                    {{ data.Posta }} {{ data.Kraj }}<br />
                    {{ data.Drzava }}</a>
            </div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Datum izvedbe</div>
            <div id="kupec-pe" class="pull-right">{{ data.DatumIzvedbe }}</div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Datum naloga</div>
            <div id="kupec-dst" class="pull-right">{{ data.DatumNaloga }}</div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Opis:</div>
            <div id="kupec-komerc" class="pull-right">{{ data.Opis }}</div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Šifra dejavnosti:</div>
            <div id="kupec-sif" class="pull-right">{{ data.sifDej }}</div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="row info-row-li">
            <div class="pull-left">Šifra dejavnosti:</div>
            <div id="Div1" class="pull-right">{{ data.DatumIzvedbe }}</div>
        </div>
    </li>
</ul>

有什么想法吗？

更新

这是新的控制器：

dndetail.controller('dndetailCtrl', ['$rootScope', '$scope', '$routeParams', function ($rootScope, $scope, $routeParams) {
    $rootScope.dnlist;
    $scope.id = $routeParams.dnid;
        for (var i = 0; i <= $rootScope.dnlist.length; i++) {
            if ($rootScope.dnlist[i].ID === $scope.id) {
                $scope.data = $rootScope.dnlist[i];
            }
        }
}]);

还是不行。从一组元素中，我想通过 id 获取一个元素，然后将其保存到数据中，以便我可以从数据中读取。 For 循环没有获取数据（未识别的 dnlist），但如果我在模板中绑定 {{ $root.dnlist[1].Property }} 它可以工作。

Answer 1

我认为这个答案没有解决问题并试图删除它，我已取消删除它，因为它已在评论中提及。

$http in angularjs 返回一个promise，你不能直接使用promise 来访问数据，检查这个答案answer 非常相似。

Answer 2

如果有人想知道问题出在相等运算符上。如果我将 === 更改为检查类型 == 我不会再收到 TypeError: Cannot read property 'ID' of undefined error。由于这是解决问题的方法，我也想解释一下。我是一个真正的 javascript 初学者，如果有人知道这里发生了什么，我非常想知道解释。

工作的新控制器：

dndetail.controller('dndetailCtrl', ['$rootScope', '$scope', '$routeParams', function ($rootScope, $scope, $routeParams) {
    $rootScope.dnlist;
    $scope.id = $routeParams.dnid;
        for (var i = 0; i <= $rootScope.dnlist.length; i++) {
            if ($rootScope.dnlist[i].ID == $scope.id) {
                $scope.data = $rootScope.dnlist[i];
            }
        }
}]);