Question

我的指令中有一个函数：

      $scope.showUsers = function (groupId) {
                $rootScope.$broadcast("rCube-usermgr-user-list-show", 
                      {id:groupId});
                console.log("inside usergroupitem"+groupId);
            };

当用户点击按钮时发送广播，并且将执行showUsers。

这是带有ng-click的tpl文件：

<li class="list-group-item">
<div class="row">
    <div class="col-md-1">{{ group.name }}</div>

    <div class="col-md-4"><label>{{ group.description }}</label></div>
    <div class="col-md-2">
        <div class="row">
            <div class="col-xs-4 col-sm-4">
                <md-icon-button ng-click="showUsers(group.id)">
                    <md-icon md-font-icon="fa-user-plus" class="fa md-mini"></md-icon>
                </md-icon-button>
            </div>
            <div class="col-xs-4 col-sm-4">
                other buttons
            </div>
        </div>

    </div>
</div>

组ID在控制器中的$ on函数中被捕获：

 (function (module) {
'use strict';

module.controller('userGroupList', function ($scope, rCubeUiTopics, groupService, $compile, $rootScope) {

    $scope.$on('rCube-usermgr-user-list-show', function (events, args) {
        console.log("args value" + args.id);

        var parent = angular.element('#group-details-container');
        parent.empty();
        var element = $compile('<usermgr-user-list groupId='+args.id+'></usermgr-user-list>')($scope);
        parent.append(element);
    });

});

})(angular.module('r-cube-user-mgt.user-group'));

然而，当加载usermgr-user-list时，它没有通过组ID未定义。 $ compile只能用于指令的链接吗？我究竟做错了什么？

这是我的usermgr-user-list指令：

module.directive('usermgrUserList', function () {
    return {
        restrict: 'E',
        scope:{
            groupId : '='
        },
        controller: function ($scope, userService) {

                  //call method and pass group id 



        },
        templateUrl: 'r-cube-user-mgt/user/list/list.tpl.html'
    };
});

我需要组ID来调用方法。但是组ID未定义。谁能告诉我我做错了什么？

Answer 1

范围参数是使用驼峰案例定义的：groupId但在html中你应该使用短划线，即group-id

即。：

var element = $compile('<usermgr-user-list group-id='+args.id+'></usermgr-user-list>')($scope);

使用$ compile in $ on function not working

1 个答案: