Question

我已将我的一个Angular控制器转换为Controller As语法，但我无法正常使用ng-grid模板。

控制器有一个名为edit user的功能，如下所示

self.editUser = function (user_data) {
    var modalInstance = $modal.open({
        templateUrl: '/admin/views/adminuser.html',
            controller: 'AdminUserController',
            resolve: {
                user_data: function () {
                    return user_data;
                }
            }
        });

        modalInstance.result.then(function () {
            self.myQueryData.refresh = !self.myQueryData.refresh;
        });
    };

ng-grid模板看起来像这样

<div class="ngCellText" ng-class="col.colIndex()">
    <a ng-click="$parent.$parent.$parent.$parent.editUser({user_id:row.entity.id, first_name:row.entity.first_name, last_name:row.entity.last_name, email:row.entity.email})">
        <span ng-cell-text translate>Edit</span>
    </a>
</div>

我的路线看起来像这样

.when('/admin/settings', {
    templateUrl: '/admin/views/settings.html',
    controller: 'SettingsController as sc',
})

所以当我打电话

时问题出现在模板中

$parent.$parent.$parent.$parent.editUser

它不知道我在说什么，除非我包含控制器名称，如

$parent.$parent.$parent.$parent.sc.editUser,

然后它很棒。但是，我不想将此模板直接绑定到sc控制器。如何在不使用控制器名称的情况下调用editUser？

我希望在$ parent上有一个函数可以提供像

这样的函数名

$parent.$parent.$parent.$parent.getController().editUser

有什么建议吗？

Answer 1

由于您使用的是controllerAs语法，因此可以通过别名对控制器进行寻址，因此实际的模板行将如下所示：

＆＃13;

<a ng-click="sc.editUser({user_id:row.entity.id, first_name:row.entity.first_name, last_name:row.entity.last_name, email:row.entity.email})">

＆＃13;

Answer 2

您可以直接调用父作用域上的函数，而无需引用$ parent。因为您在修改视图结构时可能会遇到麻烦。

示例：

<div ng-app="MyApp">
<div ng-controller="MyController">
    {{myMessage}}
    <div ng-controller="MyController2">
        <div ng-controller="MyController3">
            <div ng-controller="MyController4">
                <button id="myButton" ng-click="setMessage('second')">Press</button>
            </div>
        </div>
    </div>
    <script>
        angular.module('MyApp', [])
           .controller('MyController', function($scope) {
            $scope.myMessage = "First";
               $scope.setMessage = function(msg) {
                $scope.myMessage = msg;
               };
        }).controller('MyController2', function($scope) {

           }).controller('MyController3', function($scope) {

           }).controller('MyController4', function($scope) {

           });
    </script>

</div>
</div>

否则你可以使用angular $ broadcast

从AngularJS中的$ parent获取控制器名称

2 个答案: