Question

大家好我已经创建了2个指令，每个指针对应一个对象，一个是adminGroups，另一个是adminProfiles。我有这个问题，第二个指令根本没有被调用。这是控制器：

angular.module('Modulx').controller('AdminsController', ['$scope', 'AdminService'
    function ($scope, AdminService ) {

        $scope.hasLoad = false;
        $scope.groups= null;
        $scope.profiles = null;

        AdminService.getAdmins().then(function (response) {
            $scope.hasLoad = true;
            $scope.groups= response.data.Groups;
            $scope.profiles = response.data.Profiles;
        });
    }
]);

我有这个html部分，当数据加载完成时，我假设应该调用这两个指令

<section class="section admin-section" ng-if="hasLoad">
    <administrator-group data="groups" />

    <administrator-profile data="profiles " />
</section>

这是指令结构它们是相同的，第二个（未被调用）就是这样，除了“Group”一词已被“profile”替换。这个工作得很好。

angular.module('Modulex').directive('administratorGroup', [
    function () {
        return {
            restrict: 'E',
            scope: { data: '=groups' },
            templateUrl: '/Content/AngularApp/Admin/AdminGroups/Template.html',
            link: function (scope, element, attrs) { },
            controller: function ($scope) {
                $scope.data;
            }
        };
    }
]);

有什么问题？为什么忽略或不调用第二个指令？谢谢。

另一个指令

angular.module('Modulex').directive('administratorProfile', [
    function () {
        return {
            restrict: 'E',
            scope: { data: '=profiles' },
            templateUrl: '/Content/AngularApp/Admin/AdminProfiles/Template.html',
            link: function (scope, element, attrs) { },
            controller: function ($scope) {
                $scope.data;
            }
        };
    }
]);

如果我排除了group指令，那么profile指令就可以了。

Answer 1

试试这种方式。问题在于你的指令实现，

angular.module('Modulex').directive('administratorProfile',function(){
        return {
            restrict: 'E',
            scope: { data: '=profiles' },
            templateUrl: '/Content/AngularApp/Admin/AdminProfiles/Template.html',
            link: function (scope, element, attrs) { },
            controller: function ($scope) {
                $scope.data;
            }
        };
});


angular.module('Modulex').directive('administratorGroup',function(){
            return {
                restrict: 'E',
                scope: { data: '=groups' },
                templateUrl: '/Content/AngularApp/Admin/AdminGroups/Template.html',
                link: function (scope, element, attrs) { },
                controller: function ($scope) {
                    $scope.data;
                }
            };
    });

Answer 2

需要关闭指令元素标记

更改此

<administrator-group data="groups" />
<administrator-profile data="profiles " />

到这个

<administrator-group data="groups"></administrator-group>
<administrator-profile data="profiles "></administrator-profile>

并像这样更改指令范围绑定

此scope: { data: '=groups' }到此scope: { data: '=' }

此处demo

Answer 3

修复如下。在主html模板中，控制器模板，我已将2个指令移到2个单独的html元素中

g++ -O3 -I/home/praneeth/computervision/dlib-18.18 /home/praneeth/computervision/dlib-18.18/dlib/all/source.cpp -lpthread -lX11 project3_face.cpp -o project_face pkg-config --cflags opencv pkg-config --libs opencv

虽然我不太明白在同一个html元素中有2个指令会有什么问题。

AngularJS指令未被称为

3 个答案: