javascript - 如何将数据从自定义 Angular 元素传递到 Controller ？

Question

我有一个 Controller 和元素指令:

        ngModule
            .controller('summaryCtrl', [ '$scope', '$http', function($scope, $http){
                $scope.loaded = false;
                $http
                    .get('some/item/'+itemId) //how do I get this itemId
                    .success(function(data){
                        $scope.data = data;
                        $scope.loaded = true;
                    })
                    .error(function(data){
                        //TODO
                    });
            }])
            .directive('cpSummary', function(){
                return {restrict: 'E', templateUrl: 'some/path.html'};
            });

我想使用这样的指令:

<cp-summary item-id="{id}" ng-controller="summaryCtrl"></cp-summary>

item-id 属性由在 ng-repeat 中呈现 cp-summary 元素的父 Controller 设置。所以我只想知道是否有可能在 summaryCtrl 中获取 item-id 属性值。

Answer 1

你应该为你的指令使用一个 Controller 。然后您可以将 item-id 传递给指令 Controller 并执行这些操作。

app.directive('cpSummary', function(){
            return {
                restrict: 'E',
                templateUrl: 'some/path.html',
                scope: {
                    item_id: '=itemId'
                },
                controller: ['$scope','$http',function($scope,$http) {
                    $http
                         .get('some/item/'+$scope.item_id)
                         .success(function(data){
                             $scope.data = data;
                             $scope.loaded = true;
                         })
                         .error(function(data){
                            //TODO
                         });
                }]
            };
        });